0

HTMLにzendフォームがあります：

<form action="" method="POST" id="orderForm" class="cmxform">
...
<td valign="top"><br /><label for="cname">Name</label></td><td><?= $this->form->name ?></td><td rowspan="3">
...

私のzendフォーム（バリデーターの属性を設定）：

...
    ->setAttrib('class', 'required')
    ->setAttrib('id', 'cname');
...

次に、バリデーターを呼び出そうとします( #nextButton-送信ではなく、ボタンのみ):

$(document).ready(function() {
        $("#nextButton").click(function() {
            $("#orderForm").validate();
        });

私のバリデーターは何もしたくありません。助けてくれてありがとう!

4

2 に答える 2

1

あなたのコード:

$(document).ready(function() {
    $("#nextButton").click(function() {
        $("#orderForm").validate();
    });
}); // <- missing ?

あなたの問題は、あなたのためにここで実際に何をしているのかについての誤解によって引き起こされて.validate()います.

  • .validate()プラグインの初期化です...フォームをテストする方法ではありません。

  • 検証テストは、さまざまなイベントによってトリガーされ、完全に自動化されます。click送信ボタンでイベントをキャプチャする必要はありません...プラグインはそれをすべて単独で行います。

jQuery:

$(document).ready(function() {

    $("#orderForm").validate(); // initialize the plugin

});

レンダリングされた HTML 出力:

<form id="orderForm">
    <input type="text" id="cname" name="cname" class="required" />
    <button id="nextButton">next</button>
</form>

動作デモ: http://jsfiddle.net/NWga4/

プラグインが適切に機能するには、入力フィールドにもname属性が必要であることを忘れないでください。

フォームを送信するのではなく、フォームの有効性を「テスト」するだけの場合は、次の.valid()メソッドを使用します...

$(document).ready(function () {

    $('#orderForm').validate(); // initialize the plugin

    $("#nextButton").click(function(e) {
        e.preventDefault();
        $('#orderForm').valid(); // trigger a test
    });

});

デモ #2: http://jsfiddle.net/QRdzg/

于 2013-04-30T14:36:59.857 に答える
1

デバッグに使用できるものはたくさんあります...最初にコンソールにエラーがないか確認してください...次に、フォームのアクション属性に # または javascript:void(); のようなものを入れます。

そしてあなたのjsで..クリックイベントの外に検証コードを入れてみてください

$('#orderForm').validate({
     rules: {
         name: required
     }
});

$('#nextButton').click(function(e){
     e.preventDefault();
     if( $("#orderForm").valid()){
      $('#orderForm').submit();
     }
});
于 2013-04-30T10:25:17.853 に答える