jQuery验证不突出显示所有字段

时间:2011-08-23 02:27:00

标签: jquery asp.net validation

我遇到了jquery验证问题。我在我的网站上以多种不同的形式使用它。对于所有表单 - 行为按照广告的方式工作,但是,在其中一个表单中,当我单击提交时 - 只有第一个字段显示消息“此字段是必需的”而不是所有显示它的消息。只有在单击提交并查看第一个验证消息之后,然后在其他一些字段中随机点击一下,才能显示剩余的验证消息。据我了解,这不是默认行为。如果需要3个字段且没有填写 - 提交操作应突出显示具有相同消息的所有3个字段吗?

这是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;
}

1 个答案:

答案 0 :(得分:3)

我已经弄明白了 - 在标记中我忘了给每个输入字段一个名称属性。将此添加到每个元素已使验证正常工作!