2012-09-07 64 views
0

我在一個ASP.Net MVC項目中使用qTip2來顯示驗證錯誤。在那個表格上,我也有根據單選按鈕做出的選擇激活/取消激活的文本字段。當不使用字段時,我設置其disabled =「disabled」屬性。這確保了這些字段的客戶端驗證(jQuery不顯眼驗證)也被禁用。現在,我想知道如何重置qTip2「氣泡」以禁用字段。如何重置qTip2驗證?

比方說,我有單選按鈕1和2分別啓用文本框A和B.我們還要說默認情況下單選按鈕1被選中,並且當選擇相應的單選按鈕時,文本框A和B是必需的字段。如果按下提交按鈕而不填寫任何文本字段,則在文本框A旁會出現一個qTip錯誤提示。現在,如果按下單選按鈕2,我必須清除該提示框,禁用文本框A及其驗證,並啓用文本框B及其驗證。但是,如果我在此時按下提交而未填寫文本框B,則不會顯示錯誤消息,並且表單未提交。

我嘗試以下命令的各種組合來實現這一點,但隨後的驗證錯誤得到完全禁用:

$('.qtip').remove(); 
$('.qtip').hide(); 
$("input.input-validation-error").removeClass("input-validation-error"); // watch out for the error message labels or they won't go away 
$('form').data('validator').resetForm(); 
$("form").validate().form(); 

無論我執行了這些命令的組合得到了點擊一個單選按鈕後適當文本框禁用/啓用,qTip泡泡消失,但即使點擊「提交」按鈕並且其他錯誤應該出現在表單上,​​它們也不會再出現。

我可能沒有使用正確的命令來重置qTip驗證泡泡。

回答

0

好的,我在發佈問題後發現了一個解決方案。我使用了本頁提出的解決方案http://johnculviner.com/?tag=/unobtrusive-validation-reset,我修改了一下。我添加了以下行:$ form.find('input')。qtip('destroy');

它給出了這樣的:

//Taken from: http://johnculviner.com/?tag=/unobtrusive-validation-reset 
(function ($) { 
    $.fn.resetValidation = function() { 
     var $form = this.closest('form'); 

     //Destroy qTip error bubbles (http://craigsworks.com/projects/forums/thread-using-qtip-with-jquery-validation-framework) 
     //$form.find('input:not(.errormessage)').qtip('destroy'); 
     $form.find('input').qtip('destroy'); 

     //reset jQuery Validate's internals 
     $form.validate().resetForm(); 

     //reset unobtrusive validation summary, if it exists 
     $form.find("[data-valmsg-summary=true]") 
      .removeClass("validation-summary-errors") 
      .addClass("validation-summary-valid") 
      .find("ul").empty(); 

     //reset unobtrusive field level, if it exists 
     $form.find("[data-valmsg-replace]") 
      .removeClass("field-validation-error") 
      .addClass("field-validation-valid") 
      .empty(); 

     return $form; 
    }; 

    //reset a form given a jQuery selected form or a child 
    //by default validation is also reset 
    $.fn.formReset = function (resetValidation) { 
     var $form = this.closest('form'); 

     $form[0].reset(); 

     if (resetValidation == undefined || resetValidation) { 
      $form.resetValidation(); 
     } 

     return $form; 
    } 
})(jQuery); 

然後單擊一個單選按鈕時,我調用$( 「形式」)resetValidation()。在適當的字段被啓用/禁用之後。