',trigger:"hover focus",title:"",delay:0,html:!1,container:!1,viewport:{selector:"body",padding:0}},c.prototype.init=function(b,c,d){this.enabled=!0,this.type=b,this.$element=a(c),this.options=this.getOptions(d),this.$viewport=this.options.viewport&&a(this.options.viewport.selector||this.options.viewport);for(var e=this.options.trigger.split(" "),f=e.length;f--;){var g=e[f];if("click"==g)this.$element.on("click."+this.type,this.options.selector,a.proxy(this.toggle,this));else if("manual"!=g){var h="hover"==g?"mouseenter":"focusin",i="hover"==g?"mouseleave":"focusout";this.$element.on(h+"."+this.type,this.options.selector,a.proxy(this.enter,this)),this.$element.on(i+"."+this.type,this.options.selector,a.proxy(this.leave,this))}}this.options.selector?this._options=a.extend({},this.options,{trigger:"manual",selector:""}):this.fixTitle()},c.prototype.getDefaults=function(){return c.DEFAULTS},c.prototype.getOptions=function(b){return b=a.extend({},this.getDefaults(),this.$element.data(),b),b.delay&&"number"==typeof b.delay&&(b.delay={show:b.delay,hide:b.delay}),b},c.prototype.getDelegateOptions=function(){var b={},c=this.getDefaults();return this._options&&a.each(this._options,function(a,d){c[a]!=d&&(b[a]=d)}),b},c.prototype.enter=function(b){var c=b instanceof this.constructor?b:a(b.currentTarget).data("bs."+this.type);return c&&c.$tip&&c.$tip.is(":visible")?void(c.hoverState="in"):(c||(c=new this.constructor(b.currentTarget,this.getDelegateOptions()),a(b.currentTarget).data("bs."+this.type,c)),clearTimeout(c.timeout),c.hoverState="in",c.options.delay&&c.options.delay.show?void(c.timeout=setTimeout(function(){"in"==c.hoverState&&c.show()},c.options.delay.show)):c.show())},c.prototype.leave=function(b){var c=b instanceof this.constructor?b:a(b.currentTarget).data("bs."+this.type);return c||(c=new this.constructor(b.currentTarget,this.getDelegateOptions()),a(b.currentTarget).data("bs."+this.type,c)),clearTimeout(c.timeout),c.hoverState="out",c.options.delay&&c.options.delay.hide?void(c.timeout=setTimeout(function(){"out"==c.hoverState&&c.hide()},c.options.delay.hide)):c.hide()},c.prototype.show=function(){var b=a.Event("show.bs."+this.type);if(this.hasContent()&&this.enabled){this.$element.trigger(b);var d=a.contains(this.$element[0].ownerDocument.documentElement,this.$element[0]);if(b.isDefaultPrevented()||!d)return;var e=this,f=this.tip(),g=this.getUID(this.type);this.setContent(),f.attr("id",g),this.$element.attr("aria-describedby",g),this.options.animation&&f.addClass("fade");var h="function"==typeof this.options.placement?this.options.placement.call(this,f[0],this.$element[0]):this.options.placement,i=/\s?auto?\s?/i,j=i.test(h);j&&(h=h.replace(i,"")||"top"),f.detach().css({top:0,left:0,display:"block"}).addClass(h).data("bs."+this.type,this),this.options.container?f.appendTo(this.options.container):f.insertAfter(this.$element);var k=this.getPosition(),l=f[0].offsetWidth,m=f[0].offsetHeight;if(j){var n=h,o=this.options.container?a(this.options.container):this.$element.parent(),p=this.getPosition(o);h="bottom"==h&&k.bottom+m>p.bottom?"top":"top"==h&&k.top-m
'}),c.prototype=a.extend({},a.fn.tooltip.Constructor.prototype),c.prototype.constructor=c,c.prototype.getDefaults=function(){return c.DEFAULTS},c.prototype.setContent=function(){var a=this.tip(),b=this.getTitle(),c=this.getContent();a.find(".popover-title")[this.options.html?"html":"text"](b),a.find(".popover-content").children().detach().end()[this.options.html?"string"==typeof c?"html":"append":"text"](c),a.removeClass("fade top bottom left right in"),a.find(".popover-title").html()||a.find(".popover-title").hide()},c.prototype.hasContent=function(){return this.getTitle()||this.getContent()},c.prototype.getContent=function(){var a=this.$element,b=this.options;return a.attr("data-content")||("function"==typeof b.content?b.content.call(a[0]):b.content)},c.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".arrow")},c.prototype.tip=function(){return this.$tip||(this.$tip=a(this.options.template)),this.$tip};var d=a.fn.popover;a.fn.popover=b,a.fn.popover.Constructor=c,a.fn.popover.noConflict=function(){return a.fn.popover=d,this}}(jQuery),+function(a){"use strict";function b(c,d){var e=a.proxy(this.process,this);this.$body=a("body"),this.$scrollElement=a(a(c).is("body")?window:c),this.options=a.extend({},b.DEFAULTS,d),this.selector=(this.options.target||"")+" .nav li > a",this.offsets=[],this.targets=[],this.activeTarget=null,this.scrollHeight=0,this.$scrollElement.on("scroll.bs.scrollspy",e),this.refresh(),this.process()}function c(c){return this.each(function(){var d=a(this),e=d.data("bs.scrollspy"),f="object"==typeof c&&c;e||d.data("bs.scrollspy",e=new b(this,f)),"string"==typeof c&&e[c]()})}b.VERSION="3.3.2",b.DEFAULTS={offset:10},b.prototype.getScrollHeight=function(){return this.$scrollElement[0].scrollHeight||Math.max(this.$body[0].scrollHeight,document.documentElement.scrollHeight)},b.prototype.refresh=function(){var b="offset",c=0;a.isWindow(this.$scrollElement[0])||(b="position",c=this.$scrollElement.scrollTop()),this.offsets=[],this.targets=[],this.scrollHeight=this.getScrollHeight();var d=this;this.$body.find(this.selector).map(function(){var d=a(this),e=d.data("target")||d.attr("href"),f=/^#./.test(e)&&a(e);return f&&f.length&&f.is(":visible")&&[[f[b]().top+c,e]]||null}).sort(function(a,b){return a[0]-b[0]}).each(function(){d.offsets.push(this[0]),d.targets.push(this[1])})},b.prototype.process=function(){var a,b=this.$scrollElement.scrollTop()+this.options.offset,c=this.getScrollHeight(),d=this.options.offset+c-this.$scrollElement.height(),e=this.offsets,f=this.targets,g=this.activeTarget;if(this.scrollHeight!=c&&this.refresh(),b>=d)return g!=(a=f[f.length-1])&&this.activate(a);if(g&&b
'}),ie=o({},Jt.DefaultType,{content:"(string|element|function)"}),oe={HIDE:"hide.bs.popover",HIDDEN:"hidden.bs.popover",SHOW:"show.bs.popover",SHOWN:"shown.bs.popover",INSERTED:"inserted.bs.popover",CLICK:"click.bs.popover",FOCUSIN:"focusin.bs.popover",FOCUSOUT:"focusout.bs.popover",MOUSEENTER:"mouseenter.bs.popover",MOUSELEAVE:"mouseleave.bs.popover"},re=function(t){var n,o;function r(){return t.apply(this,arguments)||this}o=t,(n=r).prototype=Object.create(o.prototype),n.prototype.constructor=n,n.__proto__=o;var s=r.prototype;return s.isWithContent=function(){return this.getTitle()||this._getContent()},s.addAttachmentClass=function(t){e(this.getTipElement()).addClass("bs-popover-"+t)},s.getTipElement=function(){return this.tip=this.tip||e(this.config.template)[0],this.tip},s.setContent=function(){var t=e(this.getTipElement());this.setElementContent(t.find(".popover-header"),this.getTitle());var n=this._getContent();"function"==typeof n&&(n=n.call(this.element)),this.setElementContent(t.find(".popover-body"),n),t.removeClass("fade show")},s._getContent=function(){return this.element.getAttribute("data-content")||this.config.content},s._cleanTipClass=function(){var t=e(this.getTipElement()),n=t.attr("class").match(ee);null!==n&&n.length>0&&t.removeClass(n.join(""))},r._jQueryInterface=function(t){return this.each((function(){var n=e(this).data("bs.popover"),i="object"==typeof t?t:null;if((n||!/dispose|hide/.test(t))&&(n||(n=new r(this,i),e(this).data("bs.popover",n)),"string"==typeof t)){if("undefined"==typeof n[t])throw new TypeError('No method named "'+t+'"');n[t]()}}))},i(r,null,[{key:"VERSION",get:function(){return"4.5.2"}},{key:"Default",get:function(){return ne}},{key:"NAME",get:function(){return Zt}},{key:"DATA_KEY",get:function(){return"bs.popover"}},{key:"Event",get:function(){return oe}},{key:"EVENT_KEY",get:function(){return".bs.popover"}},{key:"DefaultType",get:function(){return ie}}]),r}(Jt);e.fn[Zt]=re._jQueryInterface,e.fn[Zt].Constructor=re,e.fn[Zt].noConflict=function(){return e.fn[Zt]=te,re._jQueryInterface};var se="scrollspy",ae=e.fn[se],le={offset:10,method:"auto",target:""},ce={offset:"number",method:"string",target:"(string|element)"},he=function(){function t(t,n){var i=this;this._element=t,this._scrollElement="BODY"===t.tagName?window:t,this._config=this._getConfig(n),this._selector=this._config.target+" .nav-link,"+this._config.target+" .list-group-item,"+this._config.target+" .dropdown-item",this._offsets=[],this._targets=[],this._activeTarget=null,this._scrollHeight=0,e(this._scrollElement).on("scroll.bs.scrollspy",(function(t){return i._process(t)})),this.refresh(),this._process()}var n=t.prototype;return n.refresh=function(){var t=this,n=this._scrollElement===this._scrollElement.window?"offset":"position",i="auto"===this._config.method?n:this._config.method,o="position"===i?this._getScrollTop():0;this._offsets=[],this._targets=[],this._scrollHeight=this._getScrollHeight(),[].slice.call(document.querySelectorAll(this._selector)).map((function(t){var n,r=s.getSelectorFromElement(t);if(r&&(n=document.querySelector(r)),n){var a=n.getBoundingClientRect();if(a.width||a.height)return[e(n)[i]().top+o,r]}return null})).filter((function(t){return t})).sort((function(t,e){return t[0]-e[0]})).forEach((function(e){t._offsets.push(e[0]),t._targets.push(e[1])}))},n.dispose=function(){e.removeData(this._element,"bs.scrollspy"),e(this._scrollElement).off(".bs.scrollspy"),this._element=null,this._scrollElement=null,this._config=null,this._selector=null,this._offsets=null,this._targets=null,this._activeTarget=null,this._scrollHeight=null},n._getConfig=function(t){if("string"!=typeof(t=o({},le,"object"==typeof t&&t?t:{})).target&&s.isElement(t.target)){var n=e(t.target).attr("id");n||(n=s.getUID(se),e(t.target).attr("id",n)),t.target="#"+n}return s.typeCheckConfig(se,t,ce),t},n._getScrollTop=function(){return this._scrollElement===window?this._scrollElement.pageYOffset:this._scrollElement.scrollTop},n._getScrollHeight=function(){return this._scrollElement.scrollHeight||Math.max(document.body.scrollHeight,document.documentElement.scrollHeight)},n._getOffsetHeight=function(){return this._scrollElement===window?window.innerHeight:this._scrollElement.getBoundingClientRect().height},n._process=function(){var t=this._getScrollTop()+this._config.offset,e=this._getScrollHeight(),n=this._config.offset+e-this._getOffsetHeight();if(this._scrollHeight!==e&&this.refresh(),t>=n){var i=this._targets[this._targets.length-1];this._activeTarget!==i&&this._activate(i)}else{if(this._activeTarget&&t
-
-
+
+
-
-
+
-
+
@@ -57,7 +67,7 @@
@@ -3501,13 +3457,14 @@ Bootstrap Multiselect
Bootstrap Multiselect
Please consult the FAQ, the Issue Tracker or StackOverflow before creating a new issue; when creating an issue or a pull request, read how to contribute first. -
+
@@ -135,7 +145,9 @@
@@ -1957,10 +1976,10 @@
Call the Plugin
Configuration Options
}); @@ -1994,12 +2013,12 @@Configuration Options
});
@@ -2230,7 +2249,7 @@
@@ -3456,22 +3428,6 @@ Configuration Options
}); @@ -2264,7 +2283,7 @@Configuration Options
}); </script> <style type="text/css"> - #example-optionClass-container .multiselect-container li.odd { + #example-optionClass-container .multiselect-container .odd:not(.active) { background: #eeeeee; } </style> @@ -2291,7 +2310,7 @@Configuration Options
@@ -2315,7 +2334,7 @@
@@ -3324,22 +3328,6 @@
@@ -3390,22 +3378,6 @@ Configuration Options
<style type="text/css">
- #example-selectedClass-container li.multiselect-selected a label {
+ #example-selectedClass-container .multiselect-selected .form-check-label {
color: red;
}
</style>
@@ -2463,7 +2482,7 @@ Configuration Options
Configuration Options
}); }); </script> -<select id="example-include-reset-option" multiple="multiple"> - <option value="a">Option 1</option> - <option value="b">Option 2</option> - <option value="c">Option 3</option> - <option value="d">Option 4</option> - <option value="e">Option 5</option> - <option value="f">Option 6</option> - <option value="g">Option 7</option> - <option value="h">Option 8</option> - <option value="i">Option 9</option> - <option value="j">Option 10</option> - <option value="k">Option 11</option> - <option value="l">Option 12</option> - <option value="m">Option 13</option> - <option value="n">Option 14</option> -</select>Configuration Options
}); }); </script> -<select id="example-include-reset-divider" multiple="multiple"> - <option value="a">Option 1</option> - <option value="b">Option 2</option> - <option value="c">Option 3</option> - <option value="d">Option 4</option> - <option value="e">Option 5</option> - <option value="f">Option 6</option> - <option value="g">Option 7</option> - <option value="h">Option 8</option> - <option value="i">Option 9</option> - <option value="j">Option 10</option> - <option value="k">Option 11</option> - <option value="l">Option 12</option> - <option value="m">Option 13</option> - <option value="n">Option 14</option> -</select>Configuration Options
}); }); </script> -<select id="example-reset-text" multiple="multiple"> - <option value="a">Option 1</option> - <option value="b">Option 2</option> - <option value="c">Option 3</option> - <option value="d">Option 4</option> - <option value="e">Option 5</option> - <option value="f">Option 6</option> - <option value="g">Option 7</option> - <option value="h">Option 8</option> - <option value="i">Option 9</option> - <option value="j">Option 10</option> - <option value="k">Option 11</option> - <option value="l">Option 12</option> - <option value="m">Option 13</option> - <option value="n">Option 14</option> -</select>Templates
$(document).ready(function() { $('#example').multiselect({ templates: { - button: '<button type="button" class="multiselect dropdown-toggle" data-toggle="dropdown"></button>', - ul: '<ul class="multiselect-container dropdown-menu"></ul>', - filter: '<li class="multiselect-item filter"><div class="input-group"><span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span><input class="form-control multiselect-search" type="text"></div></li>', - filterClearBtn: '<span class="input-group-btn"><button class="btn btn-default multiselect-clear-filter" type="button"><i class="glyphicon glyphicon-remove-circle"></i></button></span>', - li: '<li><a href="javascript:void(0);"><label></label></a></li>', - divider: '<li class="multiselect-item divider"></li>', - liGroup: '<li class="multiselect-item group"><label class="multiselect-group"></label></li>' + button: '<button type="button" class="multiselect dropdown-toggle" data-toggle="dropdown"><span class="multiselect-selected-text"></span></button>', + ul: '<div class="multiselect-container dropdown-menu"></div>', + filter: '<div class="multiselect-item multiselect-filter"><div class="input-group input-group-sm p-1"><div class="input-group-prepend"><i class="input-group-text fas fa-search"></i></div><input class="form-control multiselect-search" type="text"></div></div>', + filterClearBtn: '<div class="input-group-append"><button class="multiselect-clear-filter input-group-text" type="button"><i class="fas fa-times"></i></button></div>', + li: '<a class="multiselect-option dropdown-item"></a>', + divider: '<div class="multiselect-item dropdown-divider"></div>', + liGroup: '<a class="multiselect-item multiselect-group"></a>', + resetButton: '<div class="multiselect-reset text-center p-2"><a class="btn btn-sm btn-block btn-outline-secondary"></a></div>' } }); }); @@ -3579,7 +3536,7 @@Templates
$(document).ready(function() { $('#example-templates-input').multiselect({ templates: { - li: 'Templates
$(document).ready(function() { $('#example-templates-input').multiselect({ templates: { - li: '<li><a><label style="display:inline;"></label><input type="text" /></a></li>' + li: '<a class"multiselect-option dropdown-item"><a><label style="display:inline;"></label><input type="text" /></a></a>' } }); }); @@ -3617,56 +3574,71 @@Templates
Styling
The style of the plugin is fully adaptable through CSS; a completely rendered example is shown below - including select all option, filter and option gorups_
+The style of the plugin is fully adaptable through CSS; a completely rendered example is shown below - including select all option, filter and option groups.
-<ul class="multiselect-container dropdown-menu">
- <!-- Filter -->
- <li class="multiselect-item multiselect-filter" value="0">
- <div class="input-group">
- <span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span>
+<div class="multiselect-container dropdown-menu show">
+ <div class="multiselect-item multiselect-filter">
+ <div class="input-group input-group-sm p-1">
+ <div class="input-group-prepend">
+ <i class="input-group-text fas fa-search"></i>
+ </div>
<input class="form-control multiselect-search" type="text" placeholder="Search">
- <span class="input-group-btn">
- <button class="btn btn-default multiselect-clear-filter" type="button"><i class="glyphicon glyphicon-remove-circle"></i></button>
- </span>
+ <div class="input-group-append">
+ <button class="multiselect-clear-filter input-group-text" type="button">
+ <i class="fas fa-times"></i>
+ </button>
+ </div>
</div>
- </li>
- <!-- Select all -->
- <li class="multiselect-item multiselect-all" style="border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: rgb(234, 234, 234); background: rgb(243, 243, 243);">
- <a tabindex="0" class="multiselect-all"><label class="checkbox" style="padding: 3px 20px 3px 35px;"><input type="checkbox" value="multiselect-all"> Select all</label></a>
- </li>
- <!-- Collapsible and clickable opt group -->
- <li class="multiselect-item multiselect-group">
- <a href="javascript:void(0);">
- <label><input type="checkbox" value="undefined"><b> Group 1</b></label>
- <span class="caret-container"><b class="caret"></b></span>
- </a>
- </li>
- <!-- Disabled and hidden option (hidden because of collapsible opt groups) -->
- <li class="disabled hidden">
- <a tabindex="-1"><label class="checkbox"><input type="checkbox" value="1-1" disabled=""> Option 1.1</label></a>
- </li>
- <!-- Hidden but select option -->
- <li class="active hidden">
- <a tabindex="0"><label class="checkbox"><input type="checkbox" value="1-2"> Option 1.2</label></a>
- </li>
- <!-- ... -->
- <!-- Another opt group -->
- <li class="multiselect-item multiselect-group">
- <a href="javascript:void(0);">
- <label><input type="checkbox" value="undefined"><b> Group 2</b></label>
- <span class="caret-container"><b class="caret"></b></span>
- </a>
- </li>
- <!-- Visible but not selected option -->
- <li>
- <a tabindex="0"><label class="checkbox"><input type="checkbox" value="2-1"> Option 2.1</label></a>
- </li>
-</ul>
+ </div>
+ <a class="multiselect-option dropdown-item multiselect-item multiselect-all">
+ <span class="form-check d-inline-flex" title="Select all">
+ <input class="form-check-input" type="checkbox" value="multiselect-all">
+ <label class="form-check-label font-weight-bold">Select all</label>
+ </span>
+ </a>
+ <div class="multiselect-reset text-center p-2">
+ <a class="btn btn-sm btn-block btn-outline-secondary">Reset</a>
+ </div>
+ <div class="multiselect-item dropdown-divider mt-0"></div>
+ <a class="multiselect-item multiselect-group dropdown-item">
+ <input type="checkbox" value="undefined">
+ Fruits
+ <span class="caret-container dropdown-toggle pl-1"></span>
+ </a>
+ <a class="multiselect-option dropdown-item">
+ <span class="form-check d-inline-flex" title="Apple">
+ <input class="form-check-input" type="checkbox" value="Apple">
+ <label class="form-check-label">Apple</label>
+ </span></a>
+ <a class="multiselect-option dropdown-item">
+ <span class="form-check d-inline-flex" title="Banana">
+ <input class="form-check-input" type="checkbox" value="Banana">
+ <label class="form-check-label">Banana</label>
+ </span>
+ </a>
+ <a class="multiselect-item multiselect-group dropdown-item">
+ <input type="checkbox" value="undefined">
+ Vegetables
+ <span class="caret-container dropdown-toggle pl-1"></span>
+ </a>
+ <a class="multiselect-option dropdown-item">
+ <span class="form-check d-inline-flex" title="Potato">
+ <input class="form-check-input" type="checkbox" value="Potato">
+ <label class="form-check-label">Potato</label>
+ </span>
+ </a>
+ <a class="multiselect-option dropdown-item">
+ <span class="form-check d-inline-flex" title="Parsnip">
+ <input class="form-check-input" type="checkbox" value="Parsnip">
+ <label class="form-check-label">Parsnip</label>
+ </span>
+ </a>
+</div>
- The most important classes are: multiselect-container, multiselect-filter, multiselect-all, multiselect-item, multiselect-group as well as disabled and active. Both for collapsing and filtering options, the classes multiselect-filter-hidden and multiselect-collapsible-hidden are used.
+ The most important classes are: multiselect-container, multiselect-filter, multiselect-all, multiselect-item, multiselect-group, multiselect-option as well as disabled and active. Both for collapsing and filtering options, the classes multiselect-filter-hidden and multiselect-collapsible-hidden are used.
@@ -3731,7 +3703,7 @@
Methods
-
+
-
-
-
-
+
+
@@ -3809,7 +3781,7 @@
+
+
Methods
-
+
-
-
-
-
+
+
@@ -3880,30 +3852,26 @@
+
+
Methods
-
-
-
+ });
+
+
+
-
-
-
-
@@ -3926,32 +3894,28 @@ Methods
-
-
-
-
-
-
-
+ });
+
+
+
@@ -3976,32 +3940,28 @@ Methods
-
-
-
-
-
-
-
+ });
+
+
+
@@ -4032,30 +3992,26 @@ Methods
-
-
-
-
-
-
-
+ });
+
+
+
@@ -4078,32 +4034,28 @@ Methods
-
-
-
-
-
-
-
+ });
+
+
+
@@ -4128,32 +4080,28 @@ Methods
-
-
-
-
-
-
-
+ });
+
+
+
@@ -4166,7 +4114,7 @@ Methods
});
$('#example-deselect-onChange-array-button').on('click', function() {
- $('#example-deselect-onChange-array').multiselect('deselect', '1', true);
+ $('#example-deselect-onChange-array').multiselect('deselect', ['1', '3'], true);
});
});
</script>
@@ -4192,48 +4140,46 @@ Methods
-
-
-
-
-
-
-
+ $('#example-selectAll-all').on('click', function() {
+ $('#example-selectAll').multiselect('selectAll', false);
+ });
+ });
+
+
+
+
+
<script type="text/javascript">
$(document).ready(function() {
- $('#example-selectAll').multiselect();
+ $('#example-selectAll').multiselect({
+ includeSelectAllOption: true
+ });
$('#example-selectAll-visible').on('click', function() {
$('#example-selectAll').multiselect('selectAll', true);
- $('#example-selectAll').multiselect('updateButtonText');
});
$('#example-selectAll-all').on('click', function() {
$('#example-selectAll').multiselect('selectAll', false);
- $('#example-selectAll').multiselect('updateButtonText');
});
});
</script>
@@ -4259,48 +4205,46 @@ Methods
-
-
-
-
-
-
-
+ $('#example-deselectAll-all').on('click', function() {
+ $('#example-deselectAll').multiselect('deselectAll', false);
+ });
+ });
+
+
+
+
+
<script type="text/javascript">
$(document).ready(function() {
- $('#example-deselectAll').multiselect();
+ $('#example-deselectAll').multiselect({
+ includeSelectAllOption: true
+ });
$('#example-deselectAll-visible').on('click', function() {
$('#example-deselectAll').multiselect('deselectAll', true);
- $('#example-deselectAll').multiselect('updateButtonText');
});
$('#example-deselectAll-all').on('click', function() {
$('#example-deselectAll').multiselect('deselectAll', false);
- $('#example-deselectAll').multiselect('updateButtonText');
});
});
</script>
@@ -4322,51 +4266,60 @@ Methods
-
-
-
-
-
-
-
+ $('#example-updateButtonText-update').on('click', function() {
+ $('#example-updateButtonText').multiselect('updateButtonText');
+ });
+ });
+
+
+
+
+
<script type="text/javascript">
$(document).ready(function() {
- $('#example-deselectAll').multiselect();
+ $('#example-updateButtonText').multiselect({
+ buttonContainer: ''
+ });
- $('#example-deselectAll-visible').on('click', function() {
+ $('#example-updateButtonText-select').on('click', function() {
+ $('option[value="1"]', $('#example-updateButtonText')).prop('selected', true);
+ $('option[value="3"]', $('#example-updateButtonText')).prop('selected', true);
- $('#example-deselectAll').multiselect('updateButtonText', true);
+ $('input[value="1"]', $('#example-updateButtonText-container')).prop('checked', true);
+ $('input[value="3"]', $('#example-updateButtonText-container')).prop('checked', true);
+
+ $('input[value="1"]', $('#example-updateButtonText-container')).closest('.multiselect-option').addClass('active');
+ $('input[value="3"]', $('#example-updateButtonText-container')).closest('.multiselect-option').addClass('active');
+ });
+ $('#example-updateButtonText-update').on('click', function() {
+ $('#example-updateButtonText').multiselect('updateButtonText');
});
});
</script>
@@ -4559,7 +4512,7 @@ Methods
-
+
@@ -4782,11 +4735,15 @@ Methods
-
-
-
+
+
+
+
+
+
@@ -4833,10 +4790,10 @@ Further Examples
});
@@ -4891,8 +4848,8 @@ Further Examples
-
-
+
+
@@ -4937,7 +4894,7 @@ Further Examples
nonSelectedOptions.each(function() {
var input = $('input[value="' + $(this).val() + '"]');
input.prop('disabled', true);
- input.parent('li').addClass('disabled');
+ input.closest('.multiselect-option').addClass('disabled');
});
}
else {
@@ -4945,7 +4902,7 @@ Further Examples
$('#example-limit option').each(function() {
var input = $('input[value="' + $(this).val() + '"]');
input.prop('disabled', false);
- input.parent('li').addClass('disabled');
+ input.closest('.multiselect-option').removeClass('disabled');
});
}
}
@@ -4979,7 +4936,7 @@ Further Examples
nonSelectedOptions.each(function() {
var input = $('input[value="' + $(this).val() + '"]');
input.prop('disabled', true);
- input.parent('li').addClass('disabled');
+ input.parent('.multiselect-option').addClass('disabled');
});
}
else {
@@ -4987,7 +4944,7 @@ Further Examples
$('#example-limit option').each(function() {
var input = $('input[value="' + $(this).val() + '"]');
input.prop('disabled', false);
- input.parent('li').addClass('disabled');
+ input.parent('.multiselect-option').addClass('disabled');
});
}
}
@@ -5209,18 +5166,16 @@ Further Examples
});
});
-
@@ -5263,13 +5218,15 @@ Further Examples
$('#example-modal').multiselect();
});
-
+