没有表单标签的不显眼的验证

时间:2014-06-02 10:18:39

标签: jquery asp.net jquery-validate unobtrusive-validation

我有一个提交给Web服务的表单(通过标准的AJAX,没有标签。我正在使用jQuery不显眼的验证插件来验证这个'表单'中的字段,但我无法获得验证跑。

        <div id="form-contact">
            <div class="form-group">
                <label for="txtName">Your Name</label>
                <input class="form-control" id="txtName" placeholder="Enter name" name="txtName" type="text" data-val="true" data-val-required="Your name field is required." />
                <span class="field-validation-valid" data-valmsg-for="txtName" data-valmsg-replace="true"></span>
            </div>
            <div class="form-group">
                <label for="txtEmail">Email</label>
                <input class="form-control" id="txtEmail" placeholder="Enter email" name="txtEmail" type="text" data-val="true" data-val-regex="Please enter a valid email address." data-val-regex-pattern="[a-z0-9!#$%&amp;&#39;*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&amp;&#39;*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?" data-val-required="Please enter your email address." type="text" />
                <span class="field-validation-valid" data-valmsg-for="txtEmail" data-valmsg-replace="true"></span>
            </div>
            <div class="form-group">
                <label for="txtPhone">Phone</label>
                <input type="text" class="form-control" id="txtPhone" placeholder="Enter phone number" name="txtPhone" type="text" data-val="true" data-val-required="Your phone number is required." >
                <span class="field-validation-valid" data-valmsg-for="txtPhone" data-valmsg-replace="true"></span>
            </div>

            <a id="btnSubmit" href="#">Contact us</a>
        </div>

如果我手动调用$('#txtName').validate(),则会显示我的错误消息,但我想执行$('#form-contact').validate()之类的操作并调用验证。这可能吗?

2 个答案:

答案 0 :(得分:3)

引用OP:

  

&#34;我想做$('#form-contact').validate()之类的事情并且也要调用验证。这可能吗?&#34;

这是不可能的。您的#form-contact元素为div必须form

Unobtrusive Validation插件依赖于jQuery Validate插件。你绝对不能使用jQuery Validate插件来验证来自一组<form></form>标签中未包含的输入元素的数据......这就是插件的设计操作方式。

答案 1 :(得分:-2)

    $('#form-contact input:text').each(function(){
         $(this).validate();
    }) 

这对你有用。