Jquery驗證插件| resetForm不工作

我試圖清除所有的錯誤信息以及錯誤時的clear form按鈕用戶點擊，下面是實際需求Jquery驗證插件| resetForm不工作

突出

當用戶點擊
驗證表單錯誤信息應（每場）
被清除在點擊復位按鈕，每一個錯誤應該被清除

這裏是我的代碼

$(document).ready(function(){ 
    var validator = $("#register_form").validate({ 
    validator.resetForm(); 
    focusCleanup: true, 
rules: { 
    // custom rules 
}, 
messages: { 
// custom messages 
    } 
    });

對於我來說，首先兩件事情是工作，但是當我試圖清除完整的形式，我不能做this.this是我正在試圖清除它

function clearInputForm(){ 
    alert(""); 
    var validator1 = $("#register_form").validate(); 
    validator1.resetForm(); 
    $("#register_form")[0].reset(); 
}

但沒有任何事情發生，雖然$("#register_form")[0].reset();，表單字段變得清晰，但錯誤消息沒有得到清除。

來源

2014-02-25 Umesh Awasthi

看到http://jsfiddle.net/arunpjohny/eV2Nd/2/ –

@ArunPJohny：謝謝，但對我來說'click'事件沒有得到觸發，問題似乎與'validator.resetForm（）;''內部'$（「＃register_form」）。validate'這是需要清除每個字段的錯誤信息 –

所以無論發生在這個？下面的答案由於某種原因不夠好？ – Sparky

$("#register_form")[0].reset();，表單字段越來越清晰，但錯誤消息沒有得到清除。

要做到這一點，你可以把它下面多了一個行：

function clearInputForm(){ 
    alert(""); 
    var validator1 = $("#register_form").validate(); 
    validator1.resetForm(); 
    $("#register_form")[0].reset(); 
    $('.error').hide(); 
}

雖然你應該做的是這樣的：

$(document).ready(function(){ 
    var validator = $("#register_form").validate({ 
     focusCleanup: true, 
     rules: { 
     // custom rules 
     }, 
     messages: { 
     // custom messages 
     } 
    }); 
    $('[type="reset"]').on('click', function(){ 
     validator.resetForm(); 
    }); 
});

你應該把你的validator.resetForm();的單擊事件的重置按鈕。

來源

2014-02-25 07:31:37 Jai

與此，錯誤消息不會得到清除 –

張貼一些標記或更好地爲它創建一個jsfiddle。 – Jai

報價OP：

1）驗證形式使用jQuery驗證

你不能把validator.resetForm();方法.validate()方法內。

.validate()在這裏，可以去裏面的唯一的事情是的允許選項，{option:value, option:value, etc.}逗號分隔的地圖，按照the .validate() method documentation一個插件的方法。

resetForm() method documentation

$("#register_form").validate({ 
    rules: { 
     firstname: { 
      required: true 
     }, 
     lastname: { 
      required: true 
     }, 
     cell: { 
      required: true 
     } 
    }, 
    messages: { 
     // custom messages 
    } 
});

.validate()方法DEMO：http://jsfiddle.net/P46gL/

報價OP：

2）當在現場的錯誤消息的用戶點擊應（每場）

被清除這是多虧了focusCleanup選項。正如您已經完成的那樣，將其設置爲true，並且當您單擊帶有錯誤的字段時，錯誤將清除。

$("#register_form").validate({ 
    focusCleanup: true, 
    rules: { 
     ....

focusCleanup DEMO：http://jsfiddle.net/P46gL/1/

報價OP：

3）在點擊復位按鈕，每一個錯誤應該被清除

您可以從重置按鈕的click處理程序中調用resetForm()方法。這將立即刪除整個表單中的所有錯誤消息，並將驗證插件重置爲其初始狀態。

$('#clearform').on('click', function() { 
    $("#register_form").validate().resetForm(); // clear out the validation errors 
});

確保復位按鈕是type="button"或type="reset"或會觸發驗證。

<input type="reset" id="clearform" value="reset form" />

清除錯誤DEMO：http://jsfiddle.net/P46gL/3/

通過調用JavaScript .reset()這樣清理出現場數據

可以清除掉字段的值。

$('#clearform').on('click', function() { 
    var form = $("#register_form"); 
    form.validate().resetForm();  // clear out the validation errors 
    form[0].reset();     // clear out the form data 
});

全部工作演示：http://jsfiddle.net/P46gL/4/

來源

2014-02-25 16:57:28 Sparky

拯救生命，清除錯誤信息之一！ –

如果實在不行那就試試這個方法（專爲清除數據的目的）：

1 HTML表單：

<input type='reset' class="button_grey resetForm" value='Reset'>

2 - jquery驗證

// you can add error fields 
var validator = $("#clearform").validate({ 
     focusCleanup: true 
});

3-復位形式

$('[type="reset"]').on('click', function(){ 
     $("#clearform").closest('form').find("input[type=text], textarea").val(""); 
     $('input:checkbox').removeAttr('checked'); 
     validator.resetForm(); 
     return false; 
});

來源

2015-06-17 12:52:42 saad

Jquery驗證插件| resetForm不工作

回答

相關問題