在 select2 插件中将最小值设置为 select

Question

有没有一种方法可以验证 select 两个只允许最小数量的 select 离子长度，就像 maximumSelectionLength.

我试过 minimumSelectionLength 但它对我不起作用:

<link rel="stylesheet" type="text/css" href="select2/select2.min.css" />
<script src="select2/select2.min.js" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(function() {
      $(".selecte").select2();
      maximumSelectionLength: 15;

    });
</script>

所以我希望按钮在用户 select 最多点赞 3 项之前不提交。

任何想法或建议。

Answer 1

在你的 JS 中使用 .val() 来获取输入的值，之后你可以在 if 语句中使用正则表达式，如果它 returns true（满足正则表达式设置的值要求）那么它会提交。您可以使用 console.log() 值来查看您正在使用的数据。（regex101.com 是构建正则表达式代码的好地方。）

Answer 2

select2 插件没有用于此目的的任何属性，因此您可以在 submit 事件中验证 select 元素，使您有条件，然后在实现时提交：

$('form').on('submit', function(){
     var minimum = 3;

     if($(".selecte").select2('data').length>=minimum)
         return true;
     else 
         return false;
});

希望这对您有所帮助。

$(".selecte").select2();

$('form').on('submit', function(){
     var minimum = 2;

     if($(".selecte").select2('data').length>=minimum){
         alert('Submited...')
         return true;
     }else {
       alert('Please shoose at least '+minimum+' item(s)')
         return false;
     }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="http://cdnjs.cloudflare.com/ajax/libs/select2/3.2/select2.css" rel="stylesheet"/>
<script src="http://cdnjs.cloudflare.com/ajax/libs/select2/3.2/select2.min.js"></script>
<form>
  <select multiple class="selecte" style="width:300px">
    <option value="AL">Alabama</option>
    <option value="Am">Amalapuram</option>
    <option value="An">Anakapalli</option>
    <option value="Ak">Akkayapalem</option>
    <option value="WY">Wyoming</option>
  </select>
  
  <br>
  
  <input type='submit' />
</form>

Answer 3

    var min = 1; 
    $('input[type="submit"]').on('click', function(event){
        if ($('#group_select option:selected').size() < min) {
            alert("Need at least one group");
            event.preventDefault();
        }
    });

如果不满足最低要求弹出警报。

在 select2 插件中将最小值设置为 select

Setting minimum value to select in select2 plugin

javascript

jquery

html

select

html-select