Index :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link type="text/css" href="chosen.css" rel="stylesheet" /> <title>Multiple Select box with select & disable concept</title> </head> <body> <p><em>Multiple Select</em> <select data-placeholder=" Types Your Favorite" multiple class="chzn-select" tabindex="8" size="20" > <option value=""></option> <option>Web Designing</option> <option>Web Developer</option> <option>Web Hosting</option> <option>IT</option> <option selected>Bpo</option> <option disabled>Software</option> <option selected>Networking</option> <option disabled>Web Technology</option> </select></p> </body> </html>
Script :
<script src="prototype.js" type="text/javascript"></script> <script src="chosen.proto.js" type="text/javascript"></script> <script type="text/javascript"> document.observe('dom:loaded', function(evt) { var config = { '.chzn-select' : {}, '.chzn-select-deselect' : {allow_single_deselect:true}, '.chzn-select-no-single' : {disable_search_threshold:10}, '.chzn-select-no-results': {no_results_text: "Oops, nothing found!"}, '.chzn-select-width' : {width: "95%"} } var results = []; for (var selector in config) { var elements = $$(selector); for (var i = 0; i < elements.length; i++) { results.push(new Chosen(elements[i],config[selector])); } } return results; }); </script>
No comments:
Post a Comment