Jquery.sumoselect

A jQuery Single/Multi Select plugin which can be used on almost any device

View project onGitHub

jquery.sumoselect - Demo

First import a latest version of jquery in your page. Then the jquery.sumoselect.min.js and its css (sumoselect.min.css)

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="jquery.sumoselect.min.js"><script>
<link href="sumoselect.min.css" rel="stylesheet" />

Simple

Single select.

$('.testselect1').SumoSelect();


Multiple select.

$('.testselect2').SumoSelect();



Optgroup Support

$('.optgroup_test').SumoSelect();



Search Support

$('.search_test').SumoSelect({search: true, searchText: 'Enter here.'});







With placeholder text


Multiple select.

$('.testselect3').SumoSelect({placeholder: 'This is a placeholder'});

 

 

Preselected and Disabled

Single select.

$('.testselect5').SumoSelect();


Multiple select.

$('.testselect6').SumoSelect();

 

Show ok cancel in multiselect

$('.testselect7').SumoSelect({ okCancelInMulti: true });

 

Clear selected options in multiselect

$('.multi-clean').SumoSelect({ clearAll: true });

 

Clear selected options in multiselect and close dropdown

$('.multi-clean-close').SumoSelect({closeAfterClearAll: true, clearAll: true});

Select All

$('.select1').SumoSelect({ okCancelInMulti: true, selectAll: true });

 

$('.select2').SumoSelect({ selectAll: true });

 

Other Examples

$('.testselect8').SumoSelect({ okCancelInMulti: true ,
			       triggerChangeCombined: false
			    });



Try this one on a mobile.
$('.testselect9').SumoSelect({ okCancelInMulti: true ,
			       triggerChangeCombined: true,
			       forceCustomRendering: true	
		    });

 

 

Live actions on select.




License

Copyright (c) 2014 Hemant Negi Licensed under the MIT license.