Skip to content

New features #751

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 9 commits into from
Mar 9, 2018
Merged

New features #751

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
41762cd
New features
SteveTheTechie Feb 25, 2018
cb06423
File mix-up
SteveTheTechie Feb 25, 2018
31e5da1
File mix-up
SteveTheTechie Feb 25, 2018
bc711d2
Fix formatting
SteveTheTechie Feb 25, 2018
5286ae1
Omitted a break statement
SteveTheTechie Feb 26, 2018
7f7f3e5
No array.indexOf() & simplify btn keypress handler
SteveTheTechie Feb 27, 2018
c349112
Requested changes
SteveTheTechie Mar 5, 2018
1815e57
Ooops, missed some link classes
SteveTheTechie Mar 5, 2018
07e04d7
Revert "Ooops, missed some link classes"
SteveTheTechie Mar 5, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 19 additions & 13 deletions css/jquery.multiselect.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,35 +1,41 @@
.ui-multiselect {box-sizing: border-box; padding:2px 0 2px 4px; text-align:left;}
.ui-multiselect {box-sizing: border-box; padding:2px 0 2px 4px; text-align:left; width: auto;}
.ui-multiselect .ui-multiselect-open { float:right }

.ui-multiselect-menu { display:none; box-sizing:border-box; position:absolute; text-align:left; z-index:101; width:auto; padding:3px;}
.ui-multiselect-menu { display:none; box-sizing:border-box; position:absolute; text-align:left; z-index: 101; width:auto; height:auto; padding:3px; }
.ui-multiselect-menu.ui-multiselect-listbox {position:relative; z-index: 0;}

.ui-multiselect-header { display:block; box-sizing:border-box; position:relative; width:auto; padding:3px 0 3px 4px; margin-bottom:3px;}
.ui-multiselect-header > ul { font-size:0.9em }
.ui-multiselect-header > ul > li { float:left; padding:0 10px 0 0;}
.ui-multiselect-header li { float:left; margin:0 10px 0 0;}
.ui-multiselect-header a { text-decoration:none; }
.ui-multiselect-header a:hover { text-decoration:underline; cursor: pointer;}
.ui-multiselect-header .ui-icon { float:left; }
.ui-multiselect-header .ui-multiselect-close { float:right; padding-right:0; text-align:right; }
.ui-multiselect-header .ui-multiselect-close { float:right; margin-right:0; text-align:right; }

.ui-multiselect-checkboxes { display:block; box-sizing:border-box; position:relative; overflow:auto; width: auto; border: 0;}
.ui-multiselect-checkboxes label { border:1px solid transparent; cursor:default; display:block; padding:3px 1px;}
.ui-multiselect-checkboxes label > input { position:relative; top:1px; }
.ui-multiselect-checkboxes label img { height: 30px; vertical-align: middle; padding-right: 3px;}
.ui-multiselect-checkboxes > .ui-multiselect-optgroup > a { border-bottom:1px solid; cursor: pointer; display:block; font-weight:bold; margin:1px 0; padding:3px; text-align:center; text-decoration:none; }
.ui-multiselect-checkboxes > .ui-multiselect-optgroup > ul { padding: 3px; }
.ui-multiselect-checkboxes li:not(.ui-multiselect-optgroup) { clear:both; font-size:0.9em; list-style: none; padding-right:3px;}
.ui-multiselect-checkboxes label { border:1px solid transparent; cursor:default; display:block; padding:3px 1px;}
.ui-multiselect-checkboxes input { position:relative; top:1px; cursor: pointer;}
.ui-multiselect-checkboxes img { height: 30px; vertical-align: middle; margin-right: 3px;}
.ui-multiselect-grouplabel { border-bottom:1px solid; cursor: pointer; display:block; font-weight:bold; margin:1px 0; padding:3px; text-align:center; text-decoration:none; }
.ui-multiselect-optgroup > ul { padding: 3px; }
.ui-multiselect-columns { display: inline-block; vertical-align: top; }
.ui-multiselect-collapser { float: left; padding: 0 1px; margin: 0; }
.ui-multiselect-collapsed > ul { display:none }

.ui-multiselect-single .ui-multiselect-checkboxes input { left:-9999px; position:absolute !important; top: auto !important; }
.ui-multiselect-single .ui-multiselect-checkboxes label { padding:5px !important }

.ui-multiselect.ui-multiselect-nowrap { white-space: nowrap}
.ui-multiselect.ui-multiselect-nowrap > span {display: inline-block}
.ui-multiselect.ui-multiselect-nowrap { white-space: nowrap }
.ui-multiselect.ui-multiselect-nowrap > span { display: inline-block }
.ui-multiselect-checkboxes.ui-multiselect-nowrap li,
.ui-multiselect-checkboxes.ui-multiselect-nowrap a{ white-space: nowrap}
.ui-multiselect-checkboxes.ui-multiselect-nowrap a { white-space: nowrap }

.ui-multiselect-measure > .ui-multiselect-header,
.ui-multiselect-measure > .ui-multiselect-checkboxes { float:left; }
.ui-multiselect-measure > .ui-multiselect-checkboxes { float: left; }
.ui-multiselect-measure > .ui-multiselect-checkboxes { margin: 4px; overflow-y: scroll; }

.ui-multiselect-resize { border: 2px dotted #00F }

@media print{
.ui-multiselect-menu {display: none;}
Expand Down
3 changes: 2 additions & 1 deletion css/jquery.multiselect.filter.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
.ui-multiselect-hasfilter ul { position:relative; top:2px }
.ui-multiselect-filter { float:left; margin-right:10px; font-size:11px }
.ui-multiselect-filter { float:left; margin-right:10px; font-size:11px; width:100%; }
.ui-multiselect-filter input { width:100px; font-size:10px; margin-left:5px; height:15px; padding:2px; border:1px solid #292929; -webkit-appearance:textfield; -webkit-box-sizing:content-box; }
.ui-multiselect-excluded {display: none}
2 changes: 1 addition & 1 deletion demos/animations.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="assets/prettify.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="../src/jquery.multiselect.js"></script>
Expand Down
4 changes: 2 additions & 2 deletions demos/assets/ba.hashchange.js
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion demos/basic.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="assets/prettify.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="assets/prettify.js"></script>
Expand Down
24 changes: 19 additions & 5 deletions demos/callbacks.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="assets/prettify.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="../src/jquery.multiselect.js"></script>
Expand All @@ -15,7 +15,7 @@
$(function(){

var $callback = $("#callback");

$("select").multiselect({
click: function(event, ui){
$callback.text(ui.value + ' ' + (ui.checked ? 'checked' : 'unchecked') );
Expand All @@ -42,8 +42,15 @@
var values = $.map(ui.inputs, function(checkbox){
return checkbox.value;
}).join(", ");

$callback.html("<strong>Checkboxes " + (ui.checked ? "checked" : "unchecked") + ":</strong> " + values);
},
groupsCollapsable: true,
beforecollapsetoggle: function(){
$callback.text("Option group about to be collapsed/expanded...");
},
collapsetoggle: function(){
$callback.text("Option group collapsed/expanded");
}
});

Expand All @@ -54,7 +61,7 @@

<h2>Callbacks &amp; Events</h2>
<p>Demonstrating beforeopen, open, beforeclose, close, click, checkall, uncheckall, and optgrouptoggle callbacks/events. Note that you can either
pass in an event handler in the options object upon initialization, or bind to the event (including the multiselect prefix). For example, to add an
pass in an event handler in the options object upon initialization, or bind to the event (including the multiselect prefix). For example, to add an
"open" handler, you can also use <code class="prettyprint">$("select").bind("multiselectopen", fn);</code></p>
<p class="message success" id="callback">Callback target</p>

Expand Down Expand Up @@ -101,8 +108,15 @@ <h2>Callbacks &amp; Events</h2>
var values = $.map(ui.inputs, function(checkbox){
return checkbox.value;
}).join(", ");

$callback.html("<strong>Checkboxes " + (ui.checked ? "checked" : "unchecked") + ":</strong> " + values);
},
groupsCollapsable: true,
beforecollapsetoggle: function(){
$callback.text("Option group about to be collapsed/expanded...");
},
collapsetoggle: function(){
$callback.text("Option group collapsed/expanded");
}
});
</pre>
Expand Down
2 changes: 1 addition & 1 deletion demos/enabledisable.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="assets/prettify.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="../src/jquery.multiselect.js"></script>
Expand Down
2 changes: 1 addition & 1 deletion demos/filter.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.filter.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="assets/prettify.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script type="text/javascript" src="../src/jquery.multiselect.js"></script>
Expand Down
18 changes: 9 additions & 9 deletions demos/headers.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,28 +5,28 @@
<title>jQuery MultiSelect Widget Demo</title>
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="../src/jquery.multiselect.js"></script>
<script type="text/javascript">
$(function(){

// default
$("#test-1").multiselect({
header: true
header: ['checkAll','uncheckAll']
});

// off
$("#test-2").multiselect({
header: false
});

// custom text
$("#test-3").multiselect({
header: "Choose options below"
});

});
</script>

Expand All @@ -37,7 +37,7 @@ <h2>Headers</h2>
<p>The header option can be used in three ways:</p>

<form>
<h3><code>header: true</code> (default)</h3>
<h3><code>header: ['checkAll','uncheckAll']</code> (default)</h3>
<select id="test-1" multiple="multiple" size="5">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
Expand All @@ -47,7 +47,7 @@ <h3><code>header: true</code> (default)</h3>
<option value="option6">Option 6</option>
<option value="option7">Option 7</option>
</select>

<h3><code>header: false</code></h3>
<select id="test-2" multiple="multiple" size="5">
<option value="option1">Option 1</option>
Expand All @@ -58,7 +58,7 @@ <h3><code>header: false</code></h3>
<option value="option6">Option 6</option>
<option value="option7">Option 7</option>
</select>

<h3><code>header: "Choose options below"</code></h3>
<select id="test-3" multiple="multiple" size="5">
<option value="option1">Option 1</option>
Expand Down
2 changes: 1 addition & 1 deletion demos/maxchecked.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="assets/prettify.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="../src/jquery.multiselect.js"></script>
Expand Down
2 changes: 1 addition & 1 deletion demos/position.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="assets/prettify.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="../src/jquery.multiselect.js"></script>
Expand Down
2 changes: 1 addition & 1 deletion demos/preselected.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="assets/prettify.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="../src/jquery.multiselect.js"></script>
Expand Down
2 changes: 1 addition & 1 deletion demos/refresh.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="assets/prettify.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="assets/prettify.js"></script>
Expand Down
2 changes: 1 addition & 1 deletion demos/selectedlist.htm
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="../css/jquery.multiselect.css" />
<link rel="stylesheet" type="text/css" href="assets/style.css" />
<link rel="stylesheet" type="text/css" href="assets/prettify.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript" src="../src/jquery.multiselect.js"></script>
Expand Down
Loading