2012-11-06 24 views
10

我試圖正確驗證並重置表單。驗證工作正常 - 需要的字段已被成功監控。但是,當我重置表單時 - 我只能看到我的輸入的紅色背景清晰,而不是驗證消息。重置表單時,jQuery不顯眼的表單驗證程序不會隱藏錯誤消息

按照jQuery validate documentation

復位輸入字段到它們的原始值(需要形式插件), 刪除指示無效元素和隱藏錯誤消息類。

這裏的一切,我認爲是有關這一問題的信息。請讓我知道,如果你想看到別的。

這裏是我如何在我的模型中生成一個DOM元素。此元素需要驗證:

//Model.ascx 
<div class="detailsRow required"> 
    <%= Html.LabelFor(model => model.Site) %> 
    <%= Html.DropDownListFor(model => model.SelectedSiteID, new SelectList(Model.Site, "Key", "Value"))%> 
    <%= Html.ValidationMessageFor(model => model.SelectedSiteID)%> 
</div> 

//Model.cs 
[DisplayName("Site")] 
public List<KeyValuePair<int, string>> Site { get; set; } 

[Range(0, int.MaxValue, ErrorMessage = "Site required")] 
public int SelectedSiteID { get; set; } 

網站是一個選擇列表,它以值-1開頭。其他選擇是有效的。因此,我驗證範圍從0到最大。

在JavaScript中,我跑對我的形式,下面的代碼,當用戶按下「提交」按鈕的形式:

var form = workflowDialogContent.find('form'); 
$.validator.unobtrusive.parse(form); 
//Maintain a reference to the current formValidator to be able to reset. 
var formValidator = $.data(form[0], 'validator'); 

if (form.valid()) { 
} 

按下時,用戶提交表單驗證,我的驗證消息如果所選站點的值爲-1,則會顯示該值。

現在,無論何時更改選擇,我都想重置表單。我已經採取了這樣的邏輯來自:How to clear Jquery validation error messages?

$(window).on('change', '#SelectedSiteID', function() { 
    //Returns the formValidator we maintained a reference to. 
    var validator = WorkflowDialogBuilder.getCurrentFormValidator(); 
    validator.resetForm(); 
    //TODO: resetForm's documentation says that it hides the errors, but I did not experience this, so I am doing it manually. 
    //$('.field-validation-error').empty(); 
} 

然而,當我運行此代碼...高亮顯示被刪除,但錯誤信息仍然存在。如果我調用了一小段評論代碼 - 驗證錯誤是隱藏的,但下次驗證表單時不會再次出現。

驗證後: enter image description here 調用resetForm後: enter image description here

任何想法,爲什麼我會看到這樣的行爲?

更新:作爲變通,下面的代碼位似乎適當做清理:

$('.field-validation-error').empty(); 
+0

如果我沒有記錯,驗證不會顯示並隱藏錯誤消息,但只需將文本添加到始終可見的跨度。爲了您的手動解決方案的工作,只需要執行相同的操作,並手動清空「.field-validation-error」...至於爲什麼它不能直接使用,我不知道...:/ – Tallmaris

+0

好主意。這是一個可行的替代方法,但我會暫時將其打開。謝謝! –

+0

如果你在動態加載對話框的形式,你可能會發現這個問題很有用:http://stackoverflow.com/questions/4406291/jquery-validate-unobtrusive-not-working-with-dynamic-injected-elements –

回答

0

我認爲你可以將它添加到您的解決方法:

var form = $("#MyFormId"); 
form.find(':input').removeClass("input-validation-error"); 

問候

0

爲什麼不trigger element validation只要現場改變

$('#myFormId input').on('change', function(){ 
    validator.element($(this)); 
}); 
0

到目前爲止給出的答案的唯一問題是,所有的錯誤消失,而不是你想要的。我有一個類似的問題,得到一個地址,如果狀態是DC,我需要進入象限(NW,NE,SW,SE)。我使用jquery添加和刪除需求,然後將@ Html.ValidationMessageFor()包裝在div中,然後在選擇不同狀態時隱藏div。

0

您正在使用下面,正確的?

var form = workflowDialogContent.find('form'); 

則必須使用

form.resetForm(); 

重置表單,它會奏效。

相關問題