Validation Form in asp.net with Javascript

Question

I just made my first form in asp.net with MVC | Using Jquery Ajax
Also i have successful and not successful message when the client fill the fields

The form code:

<div class="modal fade" id="ShowModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <a href="#" class="close" data-dismiss="modal">&times;</a>
                <h4>Registration form</h4>
                <div id="message1">
                    <div class="alert alert-success">
                        <span class="glyphicon glyphicon-ok"></span><strong>Success Message! Your Registration Is Complete</strong>
                    </div>
                </div>

                <div id="message2">
                    <div class="alert alert-danger">
                        <span class="glyphicon glyphicon-remove"></span><strong>Error Message! Your Registration Is Not Complete</strong>
                    </div>
                </div>

                <div class="modal-body">

                    <form id="Registration">
                        <div class="form-group">
                            <div class="input-group">
                                <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                                <input class="form-control" type="text" name="Username" id="user" placeholder="User" />
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="input-group">
                                <span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span>
                                <input class="form-control" type="email" name="Email" id="Email" placeholder="Email" />
                            </div>
                        </div>

                        <div class="form-group">
                            <div class="input-group">
                                <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
                                <input class="form-control" type="password" name="Password" id="Password" placeholder="Password" />
                            </div>
                        </div>
                    </form>

                    <div class="form-group">
                        <button class="btn btn-info form-control" type="submit" onclick="SaveForm()"><i class="glyphicon glyphicon-registration-mark"> </i>Submit</button>
                    </div>

                </div>
            </div>
        </div>

    </div>

Javascript code for the messages

  <script>
   <script>
        function SignUp() {
            $("#ShowModal").modal();
            $("#message1").hide();
            $("#message2").hide();

        }
        function SaveForm() {
            var name = $("#user").val();
            var pwd = $("#Password").val();
            var email = $("#Email").val();

            if (name == "" || pwd == "" || email == "") {

                $("#message1").hide();
                $("#message2").show();


                return false;

            }

            var data = $("#Registration").serialize();
            $.ajax({
                type: "post",
                data: data,
                url: "/Register/saveData",
                success: function (result) {

                    $("#message1").show();
                    $("#message2").hide();
                    $("#Registration")[0].reset();
                }
            });
        }

    </script>

There is an easy way to make validation for email and password? for email need the be @ and passwords need to be 6-12 character. If it's possible i can edit my error message >> id="message2 in my code.

Thanks :)

Answer 1

For a simple validation, you can use plain JavaScript method includes:

// email simple validation
if ( email.includes('@') && email.includes('.') ) {
    // email is valid

} else {
    // error message

}

// password validation
if ( password.length >= 6  && password.length <= 12 ) {
    // password have the desired length

} else {
    // error

}