Regular Expression

Explain Regular expression concepts

It is also expressed as regex. Regular expression is the backbone of form validation. We can validate any form elements using it. Both client side and server side elements can be validated using it. It is used in various programming or scripting language like PHP, JAVASCRIPT, PYTHON, PERL, etc.

It starts with carat(^) and end with dollor($) sign. E.g.

  1. /^[0-9]/ means starts with digit ie. 0 to 9, but end can be any thing.
  2. /[0-9]$/ means starting can be any character but it should end with digits.
  3. /^[0-9]$/ means starting with digit and end with digits.

Some characters are given special meaning within a regular expression, which we can not use directly, we have to use backslash if we have to use it literally. They are:
 .  *  ?  [  ]  (  )  {  }  ^  $  |  \ 

E.g. /^[a-z]+\?[a-z]+$/ Means starts with characters, separated by question mark(?), ends with characters. E.g. fb?chandra


Some shortcuts used in regular expression

We have to use digits, alphanumeric and space in many places during validation. So, we need some shortcuts which help to prevent our time.

ShortcutExpansionDescription
\d[0-9]Digits 0 to 9
\w[0-9A-Za-z_]A word character or alphanumeric
\s[ \t\n\r]White space character ie. Space, tab, newline or return


Shortcuts For Negative Or Inverse

ShortcutExpansionDescription
\D[^0-9]Non digits that not between 0 to 9
\W[^0-9A-Za-z_]Non word character or non alphanumeric ie. not contain digit, alphabet and underscore
\S[^ \t\n\r]Non white space character


Character class: [abc]

Characters surrounded by square bracket is known as character class. Any characters inclosed in square bracket is valid for that words. E.g. For regular expression Te[xs]t, both Text and Test is valid



OR Operator

Sometimes we have to use or operator in regex. We can use bitwise 'or' operator ie '|'. E.g. If we have to match either 'yes' or 'maybe', we can use the regex 'yes|maybe';



Qualifiers

Regex has three qualifiers symbols. They are

      + Means One or more characters. E.g. fb+chandra will matches fbchandra, fbbchandra, fbbbchandra, ....
      * Means No or any characters. E.g. fb*chandra will matches fchandra, fbchandra, fbbchandra, fbbbchandra, ....
      ? Means Yes or no characters. E.g. fb?chandra will matches either fchandra or fbchandra


Quantifiers

You have option to validate number of characters used.

[0-9]{1,4} -> Minimum 1 letter and maximum 4 letters

[0-9]{4} -> Only 4 letters

[0-9]{4,} -> Minimum 4 letters

[0-9]{,4} -> Maximum 4 letters



Examples

  1. Allow only digit. One or more digit
    Pattern: /^[0-9]+$/
  2. Allow both small and capital characters along with digits
    Pattern: /^[a-zA-Z0-9]+$/
  3. Allow both small and capital characters along with digits and some special characters like $%^&*
    Pattern: /^[a-zA-Z0-9%&\$\^\*]+$/


Practice session

1. Digit validation:

Javascript:
if(/^[0-9]+$/.test($('#txtAge').val())) {
  $('.validAge').text('Valid');
}
else {
  $('.validAge').text('Not Valid');
}

2. Characters and digit validation:

Javascript:
if(/^[a-zA-Z0-9]+$/.test($('#txtCharDigit').val())) {
  $('.validCharDigit').text('Valid');
}
else {
  $('.validCharDigit').text('Not Valid');
}

3. Allow both small and capital characters along with digits and some special characters like $%^&*

Javascript:
if(/^[a-zA-Z0-9%&\$\^\*]+$/.test($('#txtCharDigit').val())) {
  $('.validCharDigitSp').text('Valid');
}
else {
  $('.validCharDigitSp').text('Not Valid');
}

NOTE: If you get an error for '$ is not defined', you have to include jquery.

Name
Email
Comments
Back
Funding

We need your support to operate it properly. We have lots of ideas but less fund, so help us with your funding.

Thoughts of the day

Success is not built on success. It's built on failure. It's built on frustration. Sometimes its built on catastrophe.

Sumner Redstone
Polls
Tutorial On Request
Q. Ask us for any tutorial or any thing which helps to build your career better.
Email:
Query: