Проверка JQuery функция resetForm () не работает - PullRequest
Новая
       5

Проверка JQuery функция resetForm () не работает

2 голосов
/ 24 мая 2011

Хорошо, у меня есть форма с переключателями Да и Нет. Когда пользователь нажимает любой из них, он запускает функцию radioChanged (), которая проверяет, какой флажок установлен. Если не отмечен, он показывает поля электронной почты и проверяет форму на основе правил. Если пользователь нажимает «Да», мне нужно проверить и сбросить проверки, но они не работают. Должен ли я просто сделать новую проверку, если выбрано yes, для которого не требуются поля электронной почты? 

<script type="text/javascript">
    var validator = $("#newClient");

    function radioChange() {
        if (document.getElementById("yesbutton").checked == true) {
            document.getElementById("emailSpan").style.display = "none";
            document.getElementById("cemailSpan").style.display = "none";
            document.getElementById("emailError").style.display = "none";
            document.getElementById("cemailError").style.display = "none";
            validator.resetForm();
        } else if (document.getElementById("nobutton").checked == true) {
            document.getElementById("emailSpan").style.display = 'block';
            document.getElementById("cemailSpan").style.display = 'block';
            document.getElementById("emailError").style.display = "block";
            document.getElementById("cemailError").style.display = "block";

            validator.validate({
                rules: {
                    Email: {
                        required: true,
                        minlength: 4,
                        maxlength: 48,
                        email: true
                    },
                    ConfirmEmail: {
                        required: true,
                        minlength: 4,
                        maxlength: 48,
                        email: true,
                        equalTo: "#Email"
                    }
                },
                messages: {
                    Email: {
                        required: "Please enter a valid email address",
                        email: "Please enter a valid email address",
                        maxlength: "Max length is 48"
                    },
                    ConfirmEmail: {
                        required: "Please enter a valid email address",
                        email: "Please enter a valid email address",
                        maxlength: "Max length is 48",
                        equalTo: "Emails do not match"
                    }
                },
                errorPlacement: function(error, element) {
                    if (element.attr("name") == "ConfirmEmail") error.appendTo("#cemailError");
                    else if (element.attr("name") == "Email") error.appendTo("#emailError");
                }
            })
        }
    }
</script>

Ответы [ 2 ]

0 голосов
/ 06 июня 2011 
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="dentistJquery.aspx.cs" Inherits="dentistJquery" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Jquery Validation with Regular Expressions.</title>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js" type="text/javascript"></script>
<script src="Scripts/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">

    $(document).ready(function() {

    $.validator.addMethod("email", function(value, element) 
    {  
    return this.optional(element) || /^[a-zA-Z0-9._-]+@[a-zA-Z0-9-]+\.[a-zA-Z.]{2,5}$/i.test(value);  
    }, 

    "Please enter a valid email address.");
//     if(document.getElementById("email").value !=null)
//     {

//     document.getElementById("contactnumber").style.display='block';
//     }

     $.validator.addMethod("firstname",function(value,element){
    return this.optional(element) || /^[a-zA-Z0-9._-]{5,16}$/i.test(value);  
    },"First name is required and must be valid.");

     $.validator.addMethod("lastname", function(value,element)
     {
    return this.optional(element) || /^[a-zA-Z0-9._-]{5,16}$/i.test(value);  
    }, "Last Name is required and must be valid.");


    $.validator.addMethod("contactnumber",function(value,element){
    return this.optional(element) || /^[0-9\-\+]+$/i.test(value);  
    },"Contact Number is required and must be valid.");

    $.validator.addMethod("comment" ,function(value,element){
    return this.optional(element) ||  /^[a-zA-Z0-9._-]{10,16}$/i.test(value); 
    }, "please Enter the comment at least 50 character");

        // Validate signup form
        $("#signup").validate({
                rules: {
                        email: "required email",
                        firstname: "required firstname",
                        contactnumber: "required contactnumber",
                        lastname: "required lastname",
                        comment: "required comment",
                },


        });

    });

</script>

<style>
*{ margin:0px;
padding:0px;
}
body
{
font-family:Arial, Helvetica, sans-serif;
font-size:13px;

}
input
{
width:220px;
height:25px;
font-size:13px;
margin-bottom:10px;
border:solid 1px #333333;

}
label.error 
{

font-size:11px;
background-color:#cc0000;
color:#FFFFFF;
padding:3px;
margin-left:5px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px; 
}


</style>

</head>

<body>

<div align="center">



<div style="width:650px; margin-top:20px" align="left">
<div style="margin-left:10px">
<form method="post" action="About.aspx" name="signup" id="signup">
<b>First Name</b><br />
<input type="text" name="firstname" value="Please Enter First Name" id="firstname" /><br />
<b>Last Name</b><br />
<input type="text" name="lastname" value=" Please Enter Last Name" id="lastname" /><br />

<b>Email</b><br />
<input type="text" name="email" value="Please Enter your Email "  id="email"  /><br />
<b>phone Number</b><br />
<input type="text" name="contactnumber" value=" Please Enter Your Contact Number"  id="contactnumber" /><br />
<b>Message</b><br />
<textarea name="comment" id="comment"   ></textarea> <br /><br />
<input type="submit" value=" Submit " name='SUBMIT' id="SUBMIT"/>
</form>
</div>
</div>
</div>
</body>
</html>
0 голосов
/ 24 мая 2011

Здравствуйте, Джейкоб, кажется, вам нужно знать некоторые основы для создания хорошо написанных и аккуратных кодов Java-скриптов.Я думаю, что проблема с вашим кодом заключается в том, что вы делаете небольшие проблемы, которые иногда невозможно увидеть.Вот обновленный код, скажите мне, работает ли он или нет. 

var validator = $("#newClient");

function radioChange() {
    if (document.getElementById("yesbutton").checked === true) {
        document.getElementById("emailSpan").style.display = "none";
        document.getElementById("cemailSpan").style.display = "none";
        document.getElementById("emailError").style.display = "none";
        document.getElementById("cemailError").style.display = "none";
        validator.resetForm();
    } else if (document.getElementById("nobutton").checked === true) {
        document.getElementById("emailSpan").style.display = 'block';
        document.getElementById("cemailSpan").style.display = 'block';
        document.getElementById("emailError").style.display = "block";
        document.getElementById("cemailError").style.display = "block";

        validator.validate({
            rules: {
                Email: {
                    required: true,
                    minlength: 4,
                    maxlength: 48,
                    email: true
                },
                ConfirmEmail: {
                    required: true,
                    minlength: 4,
                    maxlength: 48,
                    email: true,
                    equalTo: "#Email"
                }
            },
            messages: {
                Email: {
                    required: "Please enter a valid email address",
                    email: "Please enter a valid email address",
                    maxlength: "Max length is 48"
                },
                ConfirmEmail: {
                    required: "Please enter a valid email address",
                    email: "Please enter a valid email address",
                    maxlength: "Max length is 48",
                    equalTo: "Emails do not match"
                }
            },
            errorPlacement: function(error, element) {
                if (element.attr("name") === "ConfirmEmail") {
                    error.appendTo("#cemailError");
                }
                else if (element.attr("name") === "Email") {
                    error.appendTo("#emailError");
                }
            }
        });
    }
}

Надеюсь, это поможет!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...