web-dev-qa-db-ja.com

AJAX jQueryvalidateで呼び出した後にフィールドを手動で無効にする方法

注:以下のコードはデモンストレーション用であり、jQueryとjQuery検証プラグインを使用しています。

2つのフィールド(メールアドレスと在庫番号)を持つフォームがあるとします。

<form action="/something" method="post" id="demoForm">
     Inventory No: <input type="text" class="required" name="inventory_no" />
     Email: <input type="text" class="required" name="email" />
     <input type='submit' value='submit' />
</form>

プラグインをフォームにバインドする:

jQuery(function(){
    jQuery('#demoForm').validate();
});

//handle user submit

jQuery('#demoForm').bind('submit', function (e) {
    e.preventDefault();

    if (jQuery(e.target).valid()) {
        //form is valid submit request thru ajax

        jQuery.ajax({
            /*more options here*/

            success: function (data) {

                /*
                 Server process request and finds that, email is already in use
                 and inventory number is invalid
                 so it sends data in some format may pe JSon
                 with field names and message indicating errors
                 eg: Email:"Already in use"
                 InventoryNo: "Invalid Inventory No",
                 Now can i invalidate these two fields on form mannualy
                 and display the message received from server for each field
                */
            }
        });
    }
});
18
Praveen Prasad

無効なフィールドがわかっている場合は、この関数を使用できます。 http://docs.jquery.com/Plugins/Validation/Validator/showErrors

var validator = $( "#myshowErrors" ).validate();
validator.showErrors({
  "firstname": "I know that your firstname is Pete, Pete!"
});

ここで、firstnameはフィールドのnameプロパティです。すなわちname="firstname"

35
iboware