2011-08-23 86 views
3

我遇到了jquery驗證問題。我在我的網站上以多種不同形式使用它。有了所有的表格 - 行爲如同廣告一樣,然而,在其中之一,當我點擊提交 - 只有第一個字段顯示消息「這個字段是必需的」,而不是所有的顯示它。只有在點擊提交併看到第一個驗證消息後,隨後在其他一些字段中隨機點擊,我才能看到剩餘的驗證消息。據我瞭解,這不是默認行爲。如果需要3個字段且沒有填寫 - 提交操作應該使用相同的消息權限突出顯示所有3個字段?jQuery驗證不突出顯示所有字段

這裏是JS:

$(document).ready(function() { 
    $("#form").validate({ errorElement: "div" }); 
}); 

function sendComments() { 
    if ($("#form").valid()) { 
     // something 
    } 
} 

這裏是標記:

<form id="form" runat="server">  
    <div id="divContact">  
     <table cellpadding="5" cellspacing="5"> 
     <tr> 
      <td>   
       <a class="title">Name:</a> 
       <input type="text" id="txtName" class="required" runat="server" /> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <a class="title">Email:</a> 
       <input type="text" id="txtEmail" class="required email" runat="server" /> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <a class="title">Comments:</a> 
       <textarea id="txtComments" cols="40" rows="6" class="required"></textarea> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <br /> 
       <a id="btnSend" class="roundButton" onclick="return sendComments()">Send</a> 
      </td> 
     </tr> 
     </table> 
    </div>  
</form> 

這裏是樣式表:

#divContact 
{ 
    margin-top: 50px; 
    text-align:center; 
} 

#divContact a.title 
{ 
    display:block; 
    color:White; 
    font-family:Verdana; 
    font-size:0.8em; 
} 

#txtComments, #txtEmail 
{ 
    width:100%; 
} 

#divContact table 
{ 
    text-align:left; 
    padding: 20px; 
    background-color:#3F0F54; 
    width:350px; 
    margin: 10px auto 0 auto;  
    border: 3px double grey; 

    -webkit-border-radius: 15px; 
    -moz-border-radius: 15px; 
    border-radius: 15px; 
} 

div.error 
{ 
    display:block; 
    color:Red; 
    font-size: 0.7em; 
    font-family: Verdana, Tahoma, Arial, "Helvetica Neue", Helvetica, Sans-Serif; 
} 

回答

3

我已經想通了 - 在標記我忘了給每個輸入字段一個名稱屬性。將這添加到每個元素使驗證工作正常!

相關問題