Commit 237010cd authored by David Stutz's avatar David Stutz

Added selectAllValue option.

Added the selectAllValue option to change the value by which the select
all option is identified. Cosmetics.
parent b15d6e2a
......@@ -204,6 +204,10 @@ Define if a `<option value="select-all-option"> Select all</option>` should be a
Defines the label of the select all option.
**selectAllValue**
The value by which the select all option is identified.
**enableFiltering**
Define if a text input should be created to filter results. Note that 'select all' option will select all **FILTERED** options. Default is false.
......
......@@ -810,6 +810,16 @@
}
}
});
$('#example30-select-all').on('click', function() {
$('#example30').multiselect('select', 'multiselect-all');
});
$('#example30-deselect-all').on('click', function() {
$('#example30').multiselect('deselect', 'multiselect-all');
});
$('#example30').multiselect();
});
</script>
<table class="table table-striped">
......@@ -950,6 +960,31 @@
}
});
});
&lt;/script&gt;
</pre>
</td>
</tr>
<tr>
<td>
<div class="btn-group">
<select id="example30" multiple="multiple">
<option value="cheese">Cheese</option>
<option value="tomatoes">Tomatoes</option>
<option value="mozarella">Mozzarella</option>
<option value="mushrooms">Mushrooms</option>
<option value="pepperoni">Pepperoni</option>
<option value="onions">Onions</option>
</select>
<button id="example30-select-all" class="btn btn-primary">Select all</button>
<button id="example30-deselect-all" class="btn">Deselect all</button>
</div>
</td>
<td>
<pre class="prettyprint linenums">
&lt;script type=&quot;text/javascript&quot;&gt;
$(document).ready(function() {
});
&lt;/script&gt;
</pre>
</td>
......@@ -1135,6 +1170,23 @@
selectAllText: true
});
});
&lt;/script&gt;
</pre>
</td>
</tr>
<tr>
<td><code>selectAllValue</code></td>
<td>
The value by which the select all option is identified.
</td>
<td>
<pre class="prettyprint linenums">
&lt;script type=&quot;text/javascript&quot;&gt;
$(document).ready(function() {
$(&#39;.multiselect&#39;).multiselect({
selectAllValue: 'multiselect-all',
});
});
&lt;/script&gt;
</pre>
</td>
......
......@@ -144,6 +144,7 @@
maxHeight: false,
includeSelectAllOption: false,
selectAllText: ' Select all',
selectAllValue: 'multiselect-all',
enableFiltering: false,
filterPlaceholder: 'Search'
},
......@@ -166,7 +167,7 @@
var selected = $(element).prop('selected') || false;
var $checkbox = $('input', $li);
$checkbox.val(value);
if (value == 'select-all-option') $checkbox.parent().parent().addClass('multiselect-all');
if (value == this.options.selectAllValue) $checkbox.parent().parent().addClass('multiselect-all');
$('label', $li).append(" " + label);
$('.multiselect-container ul', this.$container).append($li);
......@@ -184,7 +185,7 @@
// Build the dropdown and bind event handling.
buildDropdown: function () {
var alreadyHasSelectAll = this.$select[0][0] ? this.$select[0][0].value == 'select-all-option' : false;
var alreadyHasSelectAll = this.$select[0][0] ? this.$select[0][0].value == this.options.selectAllValue : false;
// If options.includeSelectAllOption === true, add the include all checkbox.
if (this.options.includeSelectAllOption && this.options.multiple && !alreadyHasSelectAll) {
......@@ -219,7 +220,7 @@
// Bind the change event on the dropdown elements.
$('.multiselect-container ul li input', this.$container).on('change', $.proxy(function (event) {
var checked = $(event.target).prop('checked') || false;
var isSelectAllOption = $(event.target).val() == 'select-all-option';
var isSelectAllOption = $(event.target).val() == this.options.selectAllValue;
// Apply or unapply the configured selected class.
if (this.options.selectedClass) {
......@@ -345,7 +346,7 @@
var $input = $('.multiselect-container ul li input', this.$container).filter(function () {
return $(this).val() == $(element).val();
});
console.log($input);
if ($(element).is(':selected')) {
$input.prop('checked', true);
......@@ -374,8 +375,12 @@
// Select an option by its value.
select: function(value) {
var $option = $('option', this.$select).filter(function () { return $(this).val() == value; });
var $checkbox = $('.multiselect-container ul li input', this.$container).filter(function () { return $(this).val() == value; });
var $option = $('option', this.$select).filter(function () {
return $(this).val() == value;
});
var $checkbox = $('.multiselect-container ul li input', this.$container).filter(function () {
return $(this).val() == value;
});
if (this.options.selectedClass) {
$checkbox.parents('li').addClass(this.options.selectedClass);
......@@ -390,8 +395,12 @@
// Deselect an option by its value.
deselect: function(value) {
var $option = $('option', this.$select).filter(function () { return $(this).val() == value; });
var $checkbox = $('.multiselect-container ul li input', this.$container).filter(function () { return $(this).val() == value; });
var $option = $('option', this.$select).filter(function () {
return $(this).val() == value;
});
var $checkbox = $('.multiselect-container ul li input', this.$container).filter(function () {
return $(this).val() == value;
});
if (this.options.selectedClass) {
$checkbox.parents('li').removeClass(this.options.selectedClass);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment