-1

我不明白如何使用 jquery validate 验证表单以显示提交按钮。

我的javascript如下:

ko.bindingHandlers.jqValidate = {
init: function (element, valueAccessor, option) {

    var element = element;

    var validateOptions = {
        ignore: [":hidden:not(required)"],
        focusCleanup: true,
        onsubmit: true
    };

    function displaySubmitButton() { // Remove/Add class to submit button
        if ($('form').valid()) $('.toSave').show();
        else $('.toSave').hide();
    }

    $('form').bind('onchange keyup onpaste', function (event, element) {
        if ($('form').valid() === true && $(element).not('.resetForm')) $('.toSave').show();
        else if ($(element).not('.resetForm')) $('.toSave').hide();
    });
}
};

我的表格:

<ol class="MutColor13 mouseOver" data-bind="jqValidate: {}">
    <li class="rightCol">
        <strong>
            <label for="iEmailReply"><asp:Literal runat="server" ID="lEmailReply" /></label>
        </strong>
        <input id="iEmailReply" name="EmailReply" type="text" tabindex="2"
            class="MutColor13 email"
            data-bind="value: communication.Message.ReplyEmail, valueUpdate: 'afterkeydown'"
            required="required" />
    </li>
    <li class="leftCol">
        <strong>
            <label for="iEmailFrom"><asp:Literal runat="server" ID="lEmailFrom" /></label>
        </strong>
        <input id="iEmailFrom" name="EmailFrom" type="text" tabindex="1"
            class="MutColor13 email"
            data-bind="value: communication.Message.SenderEmail, valueUpdate: 'afterkeydown'"
            required="required" />
    </li>
    <!-- and more form input -->
</ol>

我的提交按钮:

<div class="buttonBlock rightButton"  data-bind="fadeVisible: validateMessage()">
    <a class="MutButton3 toSave" data-bind="click: saveMessage"><span class="MutButton3">submit</span></a>
</div> 

当我在 firebug 控制台中键入“$ ('form').valid ()”时,会出现所有错误消息。我认为提交按钮不是问题,因为此时我还没有点击

如果所有字段都有效,如何在字段(以及页面中的任何其他表单字段)显示提交按钮的同时启用来自输入简短更改的错误消息的显示?

我受到这个问题的启发:jquery validate: IF form valid then show submit button

一个工作演示: http: //jquery.bassistance.de/validate/demo/ 但按钮连续显示

4

1 回答 1

0

好的,我认为这可以工作:

http://jsfiddle.net/Ay972/10/

我做了什么 :

  $('form').bind('change oninput', function (event, element) {
        console.log('formLive :: ', $(event));

        if ($('form').valid() === true && $(element).not('.resetForm')) $('.toSave').show();
        else if ($(element).not('.resetForm')) $('.toSave').hide();
    });

“更改输入”似乎有效。

于 2013-08-08T14:29:03.070 回答