asp.net與jQuery驗證問題

我有2個textboxs，2個checkboxs和2個標籤。asp.net與jQuery驗證問題

第一個文本框，複選框，和標籤相互關聯和相同的休息。

文本應該接受基於jQuery驗證插件當chackbox檢查驗證規則會改變，並在這兩個選項的錯誤信息有效的電話號碼會DISPLY標籤內。

我沒有問題，以實現對於一個文本框，但是當我添加第二個將有一個問題，只有驗證將發生的只有第二個。

請看看我的代碼和建議。

<script src="js/jquery-1.4.1.js" type="text/javascript"></script> 

    <script src="js/jquery.validate.js" type="text/javascript"></script> 




<script type="text/javascript"> 
     var RegularExpression; 
     var USAPhone = /^[01]?[- .]?(\([2-9]\d{2}\)|[2-9]\d{2})[- .]?\d{3}[- .]?\d{4}$/; 
     var InterPhone = /^\d{9,12}$/; 
     var errmsg; 


     function ValidPhoneHome(sender) { 


      if (sender.checked == true) { 
       RegularExpression = InterPhone; 
       errmsg = "Enter 9 to 12 numbers as international number"; 

      } 
      else { 

       RegularExpression = USAPhone; 
       errmsg = "Enter a valid number"; 

      } 


      jQuery.validator.addMethod("phonehome", function(value, element) { 
       return this.optional(element) || RegularExpression.test(value); 
      }, errmsg); 
     } 


     function ValidMobileHome(sender) { 


      if (sender.checked == true) { 
       RegularExpression = InterPhone; 
       errmsg = "Enter 9 to 12 numbers as international number"; 

      } 
      else { 

       RegularExpression = USAPhone; 
       errmsg = "Enter a valid number"; 

      } 


      jQuery.validator.addMethod("mobilephone", function(value, element) { 
       return this.optional(element) || RegularExpression.test(value); 
      }, errmsg); 
     } 


$(document).ready(function() { 

     ValidPhoneHome("#<%= chkIntphoneHome%>"); 
     ValidMobileHome("#<%= chkIntMobileHome%>"); 


      $("#aspnetForm").validate({ 

       rules: { 
        "<%=txtHomePhone.UniqueID %>": { 

        phonehome: true 

        } 
       } 
       , errorLabelContainer: "#lblHomePhone", 


       rules: { 
        "<%=txtMobileHome.UniqueID %>": { 

        mobilephone: true 

        } 
       } 
       , errorLabelContainer: "#lblMobileHome" 
       }) 

</script> 

<asp:CheckBox ID="chkIntphoneHome" runat="server" Text="Internation Code" onclick="ValidPhoneHome(this)" > 

<asp:TextBox ID="txtHomePhone" runat="server" ></asp:TextBox> 

<label id="lblHomePhone"></label> 


<asp:CheckBox ID="chkIntMobileHome" runat="server" Text="Internation Code" onclick="ValidMobileHome(this)" /> 

<asp:TextBox ID="txtMobileHome" runat="server"></asp:TextBox> 

<label id="lblMobileHome"></label>

來源

2010-04-01 Eyla

這裏是正確的代碼：

<script src="js/jquery-1.4.1.js" type="text/javascript"></script> 

    <script src="js/jquery.validate.js" type="text/javascript"></script> 


    <script src="js/js.js" type="text/javascript"></script> 

<script type="text/javascript"> 

    $(document).ready(function() { 

     ValidPhoneHome("#<%= chkIntphoneHome%>"); 
     ValidMobileHome("#<%= chkIntMobileHome%>"); 


     $("#aspnetForm").validate({ 

      rules: { 
       "<%=txtHomePhone.UniqueID %>": { 

        phonehome: true 
       }, 
       "<%=txtMobileHome.UniqueID %>": { 

        mobilephone: true 

       } 
      }, 




       errorElement: "mydiv", 
       wrapper: "mydiv", // a wrapper around the error message 

        errorPlacement: function(error, element) { 
        offset = element.offset(); 
        error.insertBefore(element) 
        error.addClass('message'); // add a class to the wrapper 
        error.css('position', 'absolute'); 
        error.css('left', offset.left + element.outerWidth()); 
        error.css('top', offset.top - (element.height()/2)); 

       } 



     }); 
    }); 

</script> 

    <div id="mydiv"> 


       <asp:CheckBox ID="chkIntphoneHome" runat="server" Text="Internation Code" Style="position: absolute; 
        top: 113px; left: 549px;" onclick="ValidPhoneHome(this)" 
        /> 

       <asp:TextBox ID="txtHomePhone" runat="server" Style="top: 147px; left: 543px; position: absolute; 
        height: 22px; width: 128px" ></asp:TextBox> 

        <cc1:FilteredTextBoxExtender ID="txtHomePhone_FTBE" runat="server" 
        Enabled="True" FilterType="Numbers" TargetControlID="txtHomePhone"> 
       </cc1:FilteredTextBoxExtender> 

        <label id="lblHomePhone" 
        style="position:absolute; top: 175px; left: 451px; width: 351px;"></label> 


       <asp:CheckBox ID="chkIntMobileHome" runat="server" Style="position: absolute; top: 200px; 
        left: 535px;" Text="Internation Code" onclick="ValidMobileHome(this)" /> 
       <asp:TextBox ID="txtMobileHome" runat="server" Style="top: 231px; left: 555px; position: absolute; 
        height: 22px; width: 128px"></asp:TextBox> 
        <cc1:FilteredTextBoxExtender ID="txtMobileHome_FilteredTextBoxExtender" 
        runat="server" Enabled="True" FilterType="Numbers" 
        TargetControlID="txtMobileHome"> 
       </cc1:FilteredTextBoxExtender> 
        <label id="lblMobileHome" style="top: 254px; left: 449px; position: absolute; 
        height: 17px; width: 345px"></label> 


        <asp:CheckBox ID="chkIntFaxHome" runat="server" Style="position: absolute; top: 274px; 
        left: 567px;" Text="Internation Code" onclick="ValidFaxHome(this)" 
        /> 
       <asp:TextBox ID="txtFaxHome" runat="server" Style="top: 294px; left: 569px; position: absolute; 
        height: 22px; width: 128px"></asp:TextBox> 
        <label id="lblFaxHome" style="top: 321px; left: 483px; position: absolute; 
        height: 22px; width: 294px"></label> 


       <cc1:FilteredTextBoxExtender ID="txtFaxHome_FilteredTextBoxExtender" 
        runat="server" Enabled="True" FilterType="Numbers" TargetControlID="txtFaxHome"> 
       </cc1:FilteredTextBoxExtender> 


       </div>

來源

2010-04-02 22:42:58 Eyla

asp.net與jQuery驗證問題

回答

相關問題