提问者:小点点

用Javascript实现ASP.NET中的验证表单


我刚刚用Jquery Ajax
用MVC在ASP.NET中制作了我的第一个表单。当客户机填写字段时,我有成功和不成功的消息

表单代码:

<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代码

  <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>

有一种简单的方法来验证电子邮件和密码? 对于电子邮件,需要be@和密码需要6-12个字符。 如果可能的话,我可以编辑我的错误消息>;>; id=“我的代码中的Message2。

谢谢:)


共1个答案

匿名用户

对于简单的验证,可以使用普通JavaScript方法包括:

// 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

}