禁用jquery multiselect

时间:2011-06-30 08:09:46

标签: jquery jquery-ui

如何禁用多选插件

jquery multiselect

在上面的链接中,我想根据具体情况启用或禁用它。

tnx的帮助。

5 个答案:

答案 0 :(得分:14)

$("#mymultiselect").multiselect("disable");

应该这样做。

<强> HTML

<select id="test001" multiple="multiple" size="5"> 
    <option value="option1">Option 1</option> 
    <option value="option2">Option 2</option> 
    <option value="option3">Option 3</option> 
    <option value="option4">Option 4</option> 
    <option value="option5">Option 5</option> 
</select> 

使用Javascript:

$("#test001").multiselect({
    minWidth: 300,
    height: 150,
    header: false,
    noneSelectedText: "Select",
    selectedList: 3
});

调用$("#test001").multiselect("disable");将禁用多选。

这是jsfiddle

答案 1 :(得分:10)

不知道您知道多少JavaScript,但$widget.multiselect('disable');将禁用选择器(存储在变量$widget中)。将disable替换为enable即可启用它。

因此,只需使用正确的禁用/启用设置运行该功能,您就可以根据任何条件进行操作。

Terw

答案 2 :(得分:2)

如果您更改find("input:checked").length > 3 你可以选择3个值。你希望你可以改变..值并得到......你的答案

  if( $(this).multiselect("widget").find("input:checked").length > 2 ){

答案 3 :(得分:1)

我已经更新了之前发布的原始小提琴,添加了一个启用按钮以便更快地参考。 http://jsfiddle.net/cSq2L/180/

#example-div1 {
  height:100vh;
  width:100%;
  background-color:#fff;
}

#example-div2 {
  height:100vh;
  width:100%;    
  background-color:#555;
}

#example-div3 {
  height:100vh;
  width:100%;  
  background-color:#111; 
}

答案 4 :(得分:0)

从长远来看,这也许可以为您提供帮助,请尝试使用这种小提琴https://jsfiddle.net/JOKER123/bzuyp6xt/5/

function bs_muliselect_init(selector = '') {
  var selector = (selector != '') ? selector : '.bs_multiselect';
  var selector_index = $(selector).index();
  var selector_container_class = selector + '_container' + selector_index;
  selector_container_class = selector_container_class.replace(/[.#]/g, '');

  $(selector).multiselect({
    enableFiltering: true,
    enableCaseInsensitiveFiltering: true,
    includeSelectAllOption: true,
    optionClass: function(element) {
      return selector_container_class;
    },
    onChange: function(option, checked) {
      var max_limit = $(selector).attr('data-max_limit');
      var max_limit_msg = $(selector).attr('data-max_limit_msg');
      var selectedOptions = $(selector + ' option:selected');
      if (max_limit != undefined && max_limit != '' && !isNaN(max_limit)) {
        if (selectedOptions.length == max_limit) {
          alert(max_limit_msg);
          // Disable all other checkboxes.
          var nonSelectedOptions = $(selector + ' option').filter(function() {
            return !$(this).is(':selected');
          });

          nonSelectedOptions.each(function() {
            var input = $('.' + selector_container_class + ' input[value="' + $(this).val() + '"]');
            input.prop('disabled', true);
            input.parent('li').addClass('disabled');
          });
        } else {

          // Enable all checkboxes.
          $(selector + ' option').each(function() {
            var input = $('.' + selector_container_class + ' input[value="' + $(this).val() + '"]');
            input.prop('disabled', false);
            input.parent('li').addClass('disabled');
          });
        }
      }
    }
  });
}