Skip to content

Commit 9d265dc

Browse files
committed
v 1.5.5. Added Multiple option in plugin (still unofficially) with example.
1 parent c4505cc commit 9d265dc

File tree

4 files changed

+1437
-21
lines changed

4 files changed

+1437
-21
lines changed

media/css/jquery.multiselect.css

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
.ui-multiselect { padding:2px 0 2px 4px; text-align:left }
2+
.ui-multiselect span.ui-icon { float:right }
3+
.ui-multiselect-single .ui-multiselect-checkboxes input { position:absolute !important; top: auto !important; left:-9999px; }
4+
.ui-multiselect-single .ui-multiselect-checkboxes label { padding:5px !important }
5+
6+
.ui-multiselect-header { margin-bottom:3px; padding:3px 0 3px 4px }
7+
.ui-multiselect-header ul { font-size:0.9em }
8+
.ui-multiselect-header ul li { float:left; padding:0 10px 0 0 }
9+
.ui-multiselect-header a { text-decoration:none }
10+
.ui-multiselect-header a:hover { text-decoration:underline }
11+
.ui-multiselect-header span.ui-icon { float:left }
12+
.ui-multiselect-header li.ui-multiselect-close { float:right; text-align:right; padding-right:0 }
13+
14+
.ui-multiselect-menu { display:none; padding:3px; position:absolute; z-index:10000; text-align: left }
15+
.ui-multiselect-checkboxes { position:relative /* fixes bug in IE6/7 */; overflow-y:auto }
16+
.ui-multiselect-checkboxes label { cursor:default; display:block; border:1px solid transparent; padding:3px 1px }
17+
.ui-multiselect-checkboxes label input { position:relative; top:1px }
18+
.ui-multiselect-checkboxes li { clear:both; font-size:0.9em; padding-right:3px }
19+
.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label { text-align:center; font-weight:bold; border-bottom:1px solid }
20+
.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a { display:block; padding:3px; margin:1px 0; text-decoration:none }
21+
22+
/* remove label borders in IE6 because IE6 does not support transparency */
23+
* html .ui-multiselect-checkboxes label { border:none }

media/js/jquery.dataTables.columnFilter.js

Lines changed: 51 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/*
22
* File: jquery.dataTables.columnFilter.js
3-
* Version: 1.5.4.
3+
* Version: 1.5.5.
44
* Author: Jovan Popovic
55
*
66
* Copyright 2011-2014 Jovan Popovic, all rights reserved.
@@ -330,7 +330,7 @@
330330

331331
}
332332

333-
function fnCreateColumnSelect(oTable, aData, iColumn, nTh, sLabel, bRegex, oSelected) {
333+
function fnCreateColumnSelect(oTable, aData, iColumn, nTh, sLabel, bRegex, oSelected, bMultiselect) {
334334
if (aData == null)
335335
aData = _fnGetColumnValues(oTable.fnSettings(), iColumn, true, false, true);
336336
var index = iColumn;
@@ -339,6 +339,9 @@
339339
currentFilter = oSelected;
340340

341341
var r = '<select class="search_init select_filter" rel="' + i + '"><option value="" class="search_init">' + sLabel + '</option>';
342+
if(bMultiselect) {
343+
r = '<select class="search_init select_filter" rel="' + i + ' multiple>';
344+
}
342345
var j = 0;
343346
var iLen = aData.length;
344347
for (j = 0; j < iLen; j++) {
@@ -366,24 +369,47 @@
366369
var select = $(r + '</select>');
367370
nTh.html(select);
368371
nTh.wrapInner('<span class="filter_column filter_select" />');
369-
select.change(function () {
370-
//var val = $(this).val();
371-
if ($(this).val() != "") {
372-
$(this).removeClass("search_init");
373-
} else {
374-
$(this).addClass("search_init");
375-
}
376-
if (bRegex)
377-
oTable.fnFilter($(this).val(), iColumn, bRegex); //Issue 41
378-
else
379-
oTable.fnFilter(unescape($(this).val()), iColumn); //Issue 25
380-
fnOnFiltered();
381-
});
382-
if (currentFilter != null && currentFilter != "")//Issue 81
383-
oTable.fnFilter(unescape(currentFilter), iColumn);
372+
373+
if(bMultiselect) {
374+
select.change(function () {
375+
if ($(this).val() != "") {
376+
$(this).removeClass("search_init");
377+
} else {
378+
$(this).addClass("search_init");
379+
}
380+
var selectedOptions = $(this).val();
381+
var asEscapedFilters = [];
382+
if(selectedOptions==null || selectedOptions==[]){
383+
var re = '^(.*)$';
384+
}else{
385+
$.each( selectedOptions, function( i, sFilter ) {
386+
asEscapedFilters.push( fnRegExpEscape( sFilter ) );
387+
} );
388+
var re = '^(' + asEscapedFilters.join('|') + ')$';
389+
}
390+
391+
oTable.fnFilter( re, index, true, false );
392+
});
393+
} else {
394+
select.change(function () {
395+
//var val = $(this).val();
396+
if ($(this).val() != "") {
397+
$(this).removeClass("search_init");
398+
} else {
399+
$(this).addClass("search_init");
400+
}
401+
if (bRegex)
402+
oTable.fnFilter($(this).val(), iColumn, bRegex); //Issue 41
403+
else
404+
oTable.fnFilter(unescape($(this).val()), iColumn); //Issue 25
405+
fnOnFiltered();
406+
});
407+
if (currentFilter != null && currentFilter != "")//Issue 81
408+
oTable.fnFilter(unescape(currentFilter), iColumn);
409+
}
384410
}
385411

386-
function fnCreateSelect(oTable, aData, bRegex, oSelected) {
412+
function fnCreateSelect(oTable, aData, bRegex, oSelected, bMultiselect) {
387413
var oSettings = oTable.fnSettings();
388414
if ( (aData == null || typeof(aData) == 'function' ) && oSettings.sAjaxSource != "" && !oSettings.oFeatures.bServerSide) {
389415
// Add a function to the draw callback, which will check for the Ajax data having
@@ -395,17 +421,21 @@
395421
// Only rebuild the select on the second draw - i.e. when the Ajax
396422
// data has been loaded.
397423
if (oSettings.iDraw == 2 && oSettings.sAjaxSource != null && oSettings.sAjaxSource != "" && !oSettings.oFeatures.bServerSide) {
398-
return fnCreateColumnSelect(oTable, aData && aData(oSettings.aoData, oSettings), _fnColumnIndex(iColumn), nTh, sLabel, bRegex, oSelected); //Issue 37
424+
return fnCreateColumnSelect(oTable, aData && aData(oSettings.aoData, oSettings), _fnColumnIndex(iColumn), nTh, sLabel, bRegex, oSelected, bMultiselect); //Issue 37
399425
}
400426
};
401427
})(i, th, label),
402428
"sName": "column_filter_" + i
403429
});
404430
}
405431
// Regardless of the Ajax state, build the select on first pass
406-
fnCreateColumnSelect(oTable, typeof(aData) == 'function' ? null: aData, _fnColumnIndex(i), th, label, bRegex, oSelected); //Issue 37
432+
fnCreateColumnSelect(oTable, typeof(aData) == 'function' ? null: aData, _fnColumnIndex(i), th, label, bRegex, oSelected, bMultiselect); //Issue 37
407433

408434
}
435+
436+
function fnRegExpEscape( sText ) {
437+
return sText.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
438+
};
409439

410440
function fnCreateDropdown(aData) {
411441
var index = i;
@@ -722,7 +752,7 @@
722752
case "select":
723753
if (aoColumn.bRegex != true)
724754
aoColumn.bRegex = false;
725-
fnCreateSelect(oTable, aoColumn.values, aoColumn.bRegex, aoColumn.selected);
755+
fnCreateSelect(oTable, aoColumn.values, aoColumn.bRegex, aoColumn.selected, aoColumn.multiple);
726756
break;
727757
case "number-range":
728758
fnCreateRangeInput(oTable);

0 commit comments

Comments
 (0)