A Definitive Guide to Sensible Form Validations

Here is one of form validation error messages that made me laugh aloud : "invalid last name. Please enter a valid last name". The form (or the souls that coded that form) decided my last name is bad and imagine, they want me to build a valid last name too!

How to validate an email address using JavaScript

Validating email address using regular expressions is tricky and is often not recommended. The reason is simple. A valid email address as defined by RFC 2822 can be quite complex.

A valid email is of the format: name@domain

The name can be a set of 'atoms' separated by dots. In its simplest form like this: john.doe@domain

now, the atoms can contain

  1. alpha-numeric characters
  2. Any of these characters ! $ & * - = \^ ` | ~ # % ‘ + / ? _ { }
  3. single or double quotes and any character inside the quotes

Now, to the domain part. Most email validation checks assumes that the top level domain can have up to 4 characters. It is not true. There are TLDs like this: .MUSEUM .travel, .international or even .vermögensberatung

For example all the following email addresses are valid:

  • あいうえお@a.long.domain.example.university
  • one.“more\ long”@example.website.place
  • customer/department@example.com

Writing a email validation that validates for all those cases is difficult but possible. Here is an email suggested from this post:

How to add reCaptcha 2 to Contact Form 7 (updated 2019)

CAPTCHA is an acronym for “completely automated public Turing test to tell computers and humans apart.”. If you post a form on your website, you will most probably start getting spam posts through your form. This is because there are "bots" (these are just scripts that just scrape through websites) that are coded to keep traversing the internet looking for forms to submit. Since you always read form submissions from your form, the spammers get to send you marketing messages easily.

How to create google form for event registration

It is quite easy to set up a registration form for the event you are organizing, using Google forms. The best part is, Google forms is free and comes with your Google/Gmail account.

First, go to Google Forms website (https://docs.google.com/forms/ ). You should be logged in with your Google account.

How to Make a Form in HTML

Forms are essential components of any good website. A form makes it possible to collect user input. In this tutorial, we will learn how to create a form in HTML and we will also see how to process the form data.

What is CSRF (Cross-Site Request Forgery)?

Cross-Site Request Forgery (CSRF) also known as session riding or one-click attack is a security attack that executes unwanted actions on a web application on behalf of a logged-in user.

To understand this, take this scenario: suppose there is a user logged-in to their account (perhaps on a social media application). To track user sessions, the application stores cookies in user's browsers. When a user gets authenticated, a cookie is saved on their browser and on subsequent calls that they make to the application, the cookie gets sent with the request.

The cookie contains identification data that lets the application know who the user is, the actions they can perform and what they have access to. The cookie gets reused until it expires, gets invalidated or is deleted by the user through their browser settings.

Now suppose, the logged-in user was surfing the internet and they happened to be on a website made to try to perform CSRF attacks on the social media website the user uses. This malicious website won't make this obvious of course, it will most likely be an innocent-seeming website that runs scripts on the background.

Let's say the website is a file-sharing one. It would carry out the attack by having on-click listeners on links that users are likely to click on. When the user clicks on the link, a request will be made to the social media application with the user's stored cookie. When the app gets the request, it will honour it since it contains a valid cookie. The attackers will thus be able to run commands on the user's behalf.

A Definitive Guide to Sensible Form Validations

Here is one of form validation error messages that made me laugh aloud : "invalid last name. Please enter a valid last name". The form (or the souls that coded that form) decided my last name is bad and imagine, they want me to build a valid last name too!

How to validate an email address using JavaScript

Validating email address using regular expressions is tricky and is often not recommended. The reason is simple. A valid email address as defined by RFC 2822 can be quite complex.

A valid email is of the format: name@domain

The name can be a set of 'atoms' separated by dots. In its simplest form like this: john.doe@domain

now, the atoms can contain

  1. alpha-numeric characters
  2. Any of these characters ! $ & * - = \^ ` | ~ # % ‘ + / ? _ { }
  3. single or double quotes and any character inside the quotes

Now, to the domain part. Most email validation checks assumes that the top level domain can have up to 4 characters. It is not true. There are TLDs like this: .MUSEUM .travel, .international or even .vermögensberatung

For example all the following email addresses are valid:

  • あいうえお@a.long.domain.example.university
  • one.“more\ long”@example.website.place
  • customer/department@example.com

Writing a email validation that validates for all those cases is difficult but possible. Here is an email suggested from this post:

Custom styled checkboxes with Bootstrap

Sometimes, you may want to add a little more customization to your checkboxes than available in the default bootstrap style. Here is a collection of custom checkbox styles for your bootstrap projects:

Checkbox checked validation using JavaScript

You can check whether a checkbox is checked or not using checkbox_elemnt.checked attribute.

Checkbox validation using jQuery

Suppose you have a check box with ID agree_checkbox. You can check whether the checkbox is checked using this jQuery code:
$('#agree_checkbox').prop('checked')

How to create checkbox in Bootstrap style ?

Here is the code to create a simple checkbox with bootstrap style:

How to get checkbox value in form submission

Suppose you have a checkbox in your HTML form like this:

HTML Form Checkbox with required validation

The code below shows how to create a single checkbox with "required" validation. Make sure you have not selected the checkbox and then press the submit button to see the error message.