JqueryValidation插件錯誤消息問題

我想在頁面上使用JQuery驗證插件，我需要驗證表的每一行上的輸入字段。這些輸入字段不共享相同的名稱。所以我使用addMethod和addClassrules向輸入字段添加了驗證消息。JqueryValidation插件錯誤消息問題



    $.validator.addMethod("RequiredFields", $.validator.methods.required, "Required Field"); 
    $.validator.addMethod("EmailValid", $.validator.methods.email, "Invalid Email"); 
    $.validator.addClassRules("RequiredFieldValidation", { 
     RequiredFields: true 
    }); 
    $.validator.addClassRules("EmailValidation", { 
     RequiredFields: true, 
     EmailValid: true 
    }); 

    $("#Form1").validate({ 
     errorPlacement: function (error, element) { 
      if (element.parent("td").parent("tr").find('td:last-child').html() == "") { 
       element.parent("td").parent("tr").find('td:last-child').html("*"); 
       error.appendTo(element.parent("td").parent("tr").find('td:last-child')); 
      } else { 
       element.parent("td").parent("tr").find('td:last-child').append(" and "); 
       error.appendTo(element.parent("td").parent("tr").find('td:last-child')); 
      } 
     }, 
     errorClass: "ErrorCell", 
     validClass: "" 

    });

我已經加入RequiredFieldValidation和EmailValidation作爲類別到輸入字段。

我的HTML如下所示。

<pre> 
<code> 

    <form id="Form1" method="post" runat="server"> 
     <table id="tbl_Temp"> 
      <tbody> 
       <tr> 
        <th>First Name</th> 
        <th>Last Name</th> 
        <th>Email Address</th> 
        <th class="ErrorCellHeader"></th> 
       </tr> 
       <tr> 
        <td> 
         <input name="txtFName1_Temp" id="txtFName1_Temp" /> 
        </td> 
        <td> 
         <input name="txtLName1_Temp" class="RequiredFieldValidation " id="txtLName1_Temp" /> 
        </td> 
        <td> 
         <input name="txtEmail1_Temp" class="EmailValidation" id="txtEmail1_Temp" /> 
        </td> 
        <td class="ErrorMessage"></td> 
       </tr> 
       <tr> 
        <td> 
         <input name="txtFName2_Temp" id="txtFName2_Temp" /> 
        </td> 
        <td> 
         <input name="txtLName2_Temp" class="RequiredFieldValidation " id="txtLName2_Temp" /> 
        </td> 
        <td> 
         <input name="txtEmail2_Temp" class="EmailValidation" id="txtEmail2_Temp" /> 
        </td> 
        <td class="ErrorMessage"></td> 
       </tr> 
      </tbody> 
     </table> 
     <input name="btn_submit" id="btn_submit" type="submit" value="Submit" /> 
    </form> 

</code> 
</pre>

一切工作正常..除了錯誤消息。我試圖用「和」來連接消息，但是當驗證通過時我無法擺脫它們。

任何輸入讚賞。

演示可以在JSFiddle

來源

2013-09-27 Ram

報價OP發現：

「一切正常fine..except錯誤消息我試圖用連擊的消息。「和」，但我當驗證通過時，無法擺脫它們。「

您使用的是errorPlacement回調添加您的消息之間的"and"字符串。但是，errorPlacement只能用於定位頁面上的label元素。一旦創建並放置了消息label，此回調就不再使用。

errorPlacement（默認：無效的元素之後宿錯誤的標籤）
類型：Function（）創建錯誤的
自定義標籤放置。第一個參數：將創建的錯誤標籤作爲jQuery 對象。第二個參數：將無效元素作爲jQuery對象。

因爲你需要「切換」這個"and"字符串的消息一起，你就需要使用highlight和unhighlight回調函數。這些直接根據需要控制錯誤消息的切換。需要顯示錯誤消息時

火災：

亮點（默認：添加errorClass（見選項）將元素）
類型：Function（）
如何突出無效字段。覆蓋決定哪些字段以及如何突出顯示。需要刪除的錯誤消息時

火災：

unhighlight（默認值：移除errorClass）
類型：Function（）
調用，以恢復由選項高亮所做的更改，與重點相同的論點。

查看文檔：http://jqueryvalidation.org/validate/

來源

2013-09-27 19:34:39 Sparky

JqueryValidation插件錯誤消息問題

回答

相關問題