Bootstrap Validator & Image PickeR语言 如果选择了两个可用的选择输入中的任何一个,如何验证表单?



我使用引导验证器进行表单验证,并使用imagePicker来显示所选内容。它工作得很好,但我遇到了一个我自己无法解决的例子。我有一个有两个输入的表格,我需要表格来验证是否选择了这两个输入中的任何一个。我找不到引导验证器或imagePicker选项的示例

理想情况下,我想用引导验证程序或imagePicker插件来实现这一点。如果没有,我将执行If语句来切换所需的属性。

这是我的表格,非常感谢您的帮助。感谢

HTML

<form role="form">
      <h4>Select list #1</h4>
      <div class="form-group">
        <label class="hide" for="select-list-1">Select list #1</label>
        <select id="select-list-1" multiple="multiple" class="image-picker form-control" required>
          <option>Option 1</option>
          <option>Option 2</option>
          <option>Option 3</option>
        </select>
      </div>
      <h4>Select list #2</h4>
      <div class="form-group">
        <label class="hide" for="select-list-2">Select list #2</label>
        <select id="select-list-2" multiple="multiple" class="image-picker form-control" required>
          <option>Option 1</option>
          <option>Option 2</option>
          <option>Option 3</option>
        </select>
      </div>
        <button type="submit" class="btn btn-default action-btn">Submit</button>
    </form>

所以我决定最好的方法是不在这个表单上使用引导验证程序。我使用imagePicker中的点击回调函数来确定是否选择了任何图像。然后,我默认禁用了该按钮,并根据是否选择了任何图像进行切换。

//Image Picker
$("form select").imagepicker({
    show_label: true,
    clicked: function(){
        if($('form .thumbnails li div').hasClass('selected')){
            // do something
            $("form button").removeClass('disabled');
        } else {
            // do something else
            $("form button:not('.disabled')").addClass('disabled');
        }
    }
});

最新更新