0

我嘗試使用JavaScript進行表單嚮導,但是我有複選框的不顯眼驗證問題。 在頁眉中我包含了不顯眼的驗證腳本文件,之後我添加了下面的代碼: jQuery.validator.unobtrusive.adapters.addBool("brequired", "required"); 如果我提交整個表單,它就可以工作。但正如我所說我想製作精靈。所以我說在身體這個腳本文件與此內容的形式後(我剝的步驟隱藏):不重複的驗證適配器在重新驗證驗證程序後停止工作

var $jq = jQuery.noConflict(); 

if ($jq(document).ready()) { 
    //remove data-val attribute from all field in form 
    $jq('#form-wizard > div[id^=form-step] *') 
     .filter("input,select").removeAttr("data-val"); 
} 

function validate(form, currentStep) { 
    //add data-val attribute to the field which I want validate in this step 
    form.find("#form-step-" + currentStep + " *") 
     .filter("input, select").attr("data-val", "true"); 

    //without this, parse() function will not update validator 
    //regardless any changes in form (added data-val="true" attribute) 
    form.removeData("validator").removeData("unobtrusiveValidation"); 

    //I try add adapter again before parse but it don't work 
    //$jq.validator.unobtrusive.adapters.addBool("brequired", "required"); 
    $jq.validator.unobtrusive.parse(form); 

    if (!form.valid()) { 
     form.children("#form-step-" + currentStep + " *") 
      .filter("input, select").removeAttr("data-val"); 
     return false; 
    } 

    form.children("#form-step-" + currentStep + " *") 
     .filter("input, select").removeAttr("data-val"); 

    //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 true; 
} 

此的validate()函數點擊下一步按鈕後調用。但是,隨着腳本包含在頁面中,像適配器一樣的接縫不起作用。 Chcekbox未經驗證。我檢查之前解析所有必填字段,包括複選框有data-val="true"設置。

編輯: 我的形式有這樣的結構:

<form id="form-wizard"> 
    <div id="form-step-1"> 
     <input> 
      ... 
     <input> 
    </div> 
    <div id="form-step-2"> 
     <input> 
      ... 
     <input> 
    </div> 
</form> 

我真的不知道我錯過了什麼。

回答

0

好吧,我把它做得更復雜,因爲它是真的。我需要做的就是隱藏(顯示:無)div,我不想驗證。我知道它不驗證隱藏的字段,但我認爲隱藏必須是直接輸入標籤(或選擇標籤)。但它足以隱藏一些前衛標籤。例如:

<div id="form-step-2" class="hidden">...some fieldset, input etc...</div> 

現在它不會驗證form-step-2 div。

無論如何,我仍然不知道爲什麼我以前的做法是不工作...

0

看起來好像你有幾種形式,並且你想驗證被打開和關閉。您可以手動啓用和禁用每個表單的驗證。

下面是示例JavaScript代碼:

var $form = $("#my-step-1"); 

// disable validation 
$form.removeData('validator'); 
$form.removeData('unobtrusiveValidation'); 

// enable validation 
$.validator.unobtrusive.parse($form); 

在文件準備好,你可以爲所有的形式禁用驗證和手動啓用的第一個。然後,爲第二個,等等。

+0

不完全是,我只有一個在我與ID =「#形式,步進(一定數量的div形式)」。在這個div裏我有fieldset等等。 – CoCumis