0

フォームを検証するために、bassistance.de の Validation jQuery プラグインを使用しています#signup-form。通常の方法でフォーム データをサーバーに直接送信する代わりに、フォーム データを 経由で AJAX 形式で送信する必要があります$.post()。

JS コード

// Validate form
$('.signup-form').validate({
    rules: {
        signupName: { required: true, minlength: 3 }
    }
});


// Submit to Serverside
$('#submit-btn').click(function() {
    $.post('/api/register_user',
        $('#signup-modal .signup-form').serialize(),
        success: function() {
            console.log('posted!');
        }
    );
});

問題:ユーザーが jquery 検証に合格しないデータを入力した場合#submit-btnでも、クリック ハンドラーはフォームの送信を許可します! 検証エラーがないことを確認する方法はありますか?

4

2 に答える 2

3

これを試して：

// Validate form
$('.signup-form').validate({
    rules: {
    signupName: { required: true, minlength: 3 }
   }
});


// Submit to Serverside
$('#submit-btn').click(function() {
    if ($('.signup-form').valid()) {
        $.post('/api/register_user',
            $('#signup-modal .signup-form').serialize(),
            success: function() {
                console.log('posted!');
            }
        );
     }
});
于 2012-11-11T20:49:08.200 に答える
1

これを行う最善の方法は、submitHandlerオプションを使用して検証することです。

$('.signup-form').validate({
    rules: {
        signupName: { required: true, minlength: 3 }
    },
    submitHandler: function(form){
      $.post('/api/register_user',
          $('#signup-modal .signup-form').serialize(),
          success: function() {
              console.log('posted!');
          }
      );
    }
});

これは、フォームが有効になると自動的に呼び出されます。送信ボタンまたは送信イベントに新しいものを添付する必要はありません。

于 2012-11-13T16:55:15.997 に答える