0% found this document useful (0 votes)
20 views20 pages

Slide14 - RegularExpressions - and - JS Form

Regular expressions can be used to validate data in forms. They are patterns that help match text strings and are used to validate data format. Regular expressions can test for matches, specify character types and classes, and repeat parts of a pattern through quantifiers like stars, pluses and question marks. This allows validating data types and formats in form fields, like requiring values, checking for valid dates or numbers, to ensure clean and correct user input.

Uploaded by

Pro Unipadder
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
20 views20 pages

Slide14 - RegularExpressions - and - JS Form

Regular expressions can be used to validate data in forms. They are patterns that help match text strings and are used to validate data format. Regular expressions can test for matches, specify character types and classes, and repeat parts of a pattern through quantifiers like stars, pluses and question marks. This allows validating data types and formats in form fields, like requiring values, checking for valid dates or numbers, to ensure clean and correct user input.

Uploaded by

Pro Unipadder
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 20

Regular Expressions and JS Form

Session 12
(slot 22-23)
Objectives
◼ Describe regular expression
◼ Validate data in form
Regular Expressions
▪ A regular expression is a pattern, whose purpose is to help in
validating the text format
▪ Example:
Creating a regular expression

◼ let re1 = new RegExp("abc");

◼ let re2 = /abc/;

◼ Both of those regular expression


objects represent the same pattern:
an a character followed by
a b followed by a c
Testing for matches
◼ Regular expression objects have a number of methods. The simplest one is
test. If you pass it a string, it will return a Boolean telling you whether the
string contains a match of the pattern in the expression.
◼ A regular expression consisting of only nonspecial characters simply
represents that sequence of characters. If abc occurs anywhere in the
string we are testing against (not just at the start), test will return true.
console.log(/abc/.test("abcde"));
// → true
console.log(/abc/.test("abxde"));
// → false
Testing for matches
console.log(/[0123456789]/.test("in 1992"));

// → true

console.log(/[0-9]/.test("in 1992"));

// → true
Types
Character or symbols allow matching a substring that exists at
a specific position within a string.
Types
Characters or symbols are combined to form character classes for
specifying patterns.
Repeating parts of a pattern
◼ We now know how to match a single digit. What if we want to match a
whole number—a sequence of one or more digits?
◼ When you put a plus sign (+) after something in a regular expression, it
indicates that the element may be repeated more than once. Thus,
/\d+/ matches one or more digit characters.
◼ The star (*) has a similar meaning but also allows the pattern to match
zero times.
◼ A question (?) mark makes a part of a pattern optional, meaning it may
occur zero times or one time.
Repeating parts of a pattern
console.log(/'\d+'/.test("'123'"));

// → true

console.log(/'\d+'/.test("''"));

// → false

console.log(/'\d*'/.test("'123'"));

// → true

console.log(/'\d*'/.test("''"));

// → true
Repeating parts of a pattern
let neighbor = /neighbou?r/;

console.log(neighbor.test("neighbour"));

// → true

console.log(neighbor.test("neighbor"));

// → true
Repeating parts of a pattern
◼ To indicate that a pattern should occur a precise number of
times, use braces.
◼ Putting {4} after an element, for example, requires it to occur
exactly four times.
◼ It is also possible to specify a range this way: {2,4} means
the element must occur at least twice and at most four times.
◼ You can also specify open-ended ranges when using braces by
omitting the number after the comma. So, {5,} means five or
more times.
Repeating parts of a pattern

let dateTime = /\d{1,2}-\d{1,2}-\d{4} \d{1,2}:\d{2}/;

console.log(dateTime.test("1-30-2003 8:45"));

// → true
Properties and Methods
Validate data in form
❑Data validation is the process of ensuring that computer input is clean, correct,
and useful.
❑Typical validation tasks are:
✓has the user filled in all required fields?
✓has the user entered a valid date?
✓has the user entered text in a numeric field?
❑ Data validation is to ensure correct input to a computer application.
❑ Deployed in many different ways.
✓Server side validation is performed by a web server, after input has been
sent to the server.
✓Client side validation is performed by a web browser, before input is sent to
a web server.
Example: check form field is empty

Can use required attribute


Using RegExp to check data in form
Using RegExp to check data in form
exercise
Summary…
❑ A regular expression is a sequence of characters
that forms a search pattern.
❑ When you search for data in a text, you can use
this search pattern to describe what you are
searching for.
❑ HTML form validation can be done by a
JavaScript.

You might also like