Question

我有一个简单的向导，由三个简单的步骤组成。

在前两个步骤中，我有一些带有一些选择控件的表单控件，这些控件由所选插件处理

<div class="col-lg-6 col-lg-offset-1">
    <label for="ExpirationMode" class="control-label">Da operazione</label>
    <div class="">
        <select name="ExpirationMode" id="ExpirationMode"
                class="chosen-select form-control" data-placeholder="Select an item" data-rule-required="true" data-msg-required="Required field">
            <option value=""></option>
            @foreach ( ExpirationModeViewModel e in expirationModeList ) {
                <option value="@e.ExpirationModeID">@e.Description</option>
            }
        </select>
    </div>
</div>

使用以下javascript

$('.chosen-select').chosen({
    disable_search_threshold: 10,
    no_results_text: 'Oops, no results found',
    allow_single_deselect: true,
    width: '100%'
});

要使用所选插件处理验证，我在onStepChanging事件中添加了以下验证器设置

onStepChanging: function (event, currentIndex, newIndex) {
    // Disable validation on fields that are disabled or hidden.
    form.validate().settings.ignore = ":disabled,:hidden:not('select.form-control')";
    // Start validation; Prevent going forward if false
    return form.valid();
},

当我在第二个面板中添加另一个选择的选择时，会出现问题。指令form.validate().settings.ignore = ":disabled,:hidden:not('select.form-control')";也试图验证第二个面板中的所选元素。

我该如何解决这个问题？我可以告诉验证者只验证当前面板中包含的控件吗？

Answer 1

如果我找对你，我也有类似的问题。这是我找到的解决方法。在 onStepChanging 中，我添加了这段代码：

if (newIndex === 1) {
   form.validate().settings.ignore = ":disabled,:hidden:not(#partner)";
} else if (newIndex === 2) {
   form.validate().settings.ignore = ":disabled,:hidden:not(#partner2)";
} else {
   form.validate().settings.ignore = ":disabled,:hidden";
}

其中#partner和#partner2是两个<select>元素的ID。

希望它有所帮助;对我来说很好。

jQuery步骤和多个面板的验证

1 个答案: