$(document).ready(function() { $('#ddlCars').multiselect(); $('#ddlCars1').multiselect({ numberDisplayed: 2, }); $('#ddlCars2').multiselect({ includeSelectAllOption: true, enableFiltering:true }); $('#ddlCars3').multiselect({ nonSelectedText :'Select Cars' }); });
<div class="well"> <b> Normal :</b> <select id="ddlCars" multiple="multiple"> <option value="Accord">Accord</option> <option value="Duster">Duster</option> <option value="Esteem">Esteem</option> <option value="Fiero">Fiero</option> <option value="Lancer">Lancer</option> <option value="Phantom">Phantom</option> </select> </div> <div class="well"> <b> Show selected text only for 2 items :</b> <select id="ddlCars1" multiple="multiple"> <option value="Accord">Accord</option> <option value="Duster">Duster</option> <option value="Esteem">Esteem</option> <option value="Fiero">Fiero</option> <option value="Lancer">Lancer</option> <option value="Phantom">Phantom</option> </select> </div> <div class="well"> <b> With select all and filter:</b> <select id="ddlCars2" multiple="multiple"> <option value="Accord">Accord</option> <option value="Duster">Duster</option> <option value="Esteem">Esteem</option> <option value="Fiero">Fiero</option> <option value="Lancer">Lancer</option> <option value="Phantom">Phantom</option> </select> </div> <div class="well"> <b> With Custom Placehoder Text:</b> <select id="ddlCars3" multiple="multiple"> <option value="Accord">Accord</option> <option value="Duster">Duster</option> <option value="Esteem">Esteem</option> <option value="Fiero">Fiero</option> <option value="Lancer">Lancer</option> <option value="Phantom">Phantom</option> </select> </div>