In this tutorial we will show you the solution of first name validation in JavaScript, to apply validation on first name, first way is to use required attribute and another way is using JavaScript code. Let us choose JavaScript here.

Inside JavaScript, there are again two methods. First is to apply validation to check whether the field is empty or not and another is to apply validation on data that user fill inside our input type.

In last tutorial, we already done the article of validation of empty field.

So, in this tutorial we are going to apply validation on data that user fills inside input type.

Step By Step Guide On First Name Validation In JavaScript :-

As, here we already said that we are going to apply validation on first name data using JavaScript. So, let us see how to apply validation with help of codes.

// first name validation in JavaScript
var validname = /^[a-zA-Z]+ [a-zA-Z]+$/;
var fname = document.getElementById('inputFieldName').value;
if(!notname.test(fname)){
    alert('Invalid First name given.');
}else{
    alert('Valid First name given.');
}

1. As we here see that we today write only JavaScript codes in our example.
2. In previous tutorials, we already many times create a full code example in which we first create an html form with its basic structure. Inside that structure we use html, head, and title, body and script tags.
3. In this example, we have to create a form with method type post and action of any page in which you want user to redirect.
4. Inside that form, we have to create input fields. First one is of type text and second is of type submit. Inside input type text, user have to fill his/her first name and then have to click on submit button to check whether the name given by user is valid or not.
5. We can use our JavaScript function using two ways. In first one we have to direct call the JavaScript function on Form action whereas another way is to use the JavaScript function on button click. Here, there are various ways to call the function.
6. One thing to notice here that the JavaScript code in html is always written inside script tag. As we know script tag is a paired tag and it must have a closing tag. So, we have to use our JavaScript code inside script tag.
7. At next, let us understand our function now. Here, in this function we create a variable first and feed the data which we want in our first name.
8. After that we create a second variable, in which we get the value of name that user store or give to us. Now with the help of JavaScript code we check that the data filled by user is valid or not. This is done with help of comparison between data which we want and which user feed.
9. If you want to see how we done this. You can see the above example for better understanding. We hope with these steps you understand the above example easily.

Conclusion :-

At last in conclusion, here we can say that with the help of this article we are able to understand how to apply validation on first name in JavaScript.

I hope this tutorial on first name validation in JavaScript helps you and the steps and method mentioned above are easy to follow and implement.