Question

我在我的表单中引导了datetimepicker，这是填充页面其余部分所必需的字段。

我可以设法在使用提交按钮时进行验证，但我有一个复选框，使用datetimepicker中的值填充字段。

我需要使用复选框来导致datetimepicker的验证而不提交。

我的代码看起来像这样：

//My datepicker
<div id="dtpDate" class="input-append" >
    <input required data-format="yyyy-MM-dd" type="text" style="width: 75%;" />
    <span class="add-on">
        <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
    </span>
</div>

//Checkbox to cause validation
<div>
    <input type="checkbox" data-bind="checked: setdate, click: setdates"/>
</div>


//My Script
$(document).ready(function () {
    $("form").validate();
});

$(function () {
    $('#dtpDate').datetimepicker({
        pickTime: false
    })
});

如何使复选框导致验证？（未提交）

提前完成

Answer 1

编辑：这是有效的，并已在jsfiddle中进行过测试。

<form>
<div>
    <input required type="text" />
</div>
<div>
    <input type="checkbox" class="checkBox" />
</div>
<div>
    <input type="submit" />
</div>
</form>

的javascript

//My Script
$(document).ready(function () {

    $('.checkBox').click(function(){
        if($(this).is(':checked')){
            $('form').valid();
        }
    });
});

$(function () {
    $('#dtpDate').datetimepicker({
        pickTime: false
    });
});

Answer 2

在调用validate（）后验证日期时间字段调用 .valid（）

$(document).ready(function () {
    // initialise validation
    $("form").validate();

    // validated the datetime field on checkbox click
    $('#your_checkbox_id').click(function()
      $('#your_datetime_field').valid();
    });
});

Answer 3

单击复选框后，使用.valid()验证文本字段。

<强>的jQuery ：

$(document).ready(function () {

    $("form").validate({
        // your options & rules
    });

    $('#mycheck').click(function () {
        $('#myfield').valid();
    });

});

<强> HTML ：

<form>
    <input required="required" type="text" name="myfield" id="myfield" />
    <input type="checkbox" name="mycheck" id="mycheck" />
    ...
</form>

工作演示：http://jsfiddle.net/rzjRM/

使复选框导致jQuery验证

3 个答案: