javascript - How do you limit options selected in a html select box? -
i'm using select tag in form i'm making allows multiple selections, want make maximum amount of selections upto 10. possible using javascript or jquery?
thanks in advance!
here full code use...gotta love google ajax api playground :-)
edit 1: note: lets choose 5 because didn't feel copy/pasting 10 options :-)
<!-- copyright (c) 2009 google inc. free copy , use sample. license can found here: http://code.google.com/apis/ajaxsearch/faq/#license --> <!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>sample select maximum jquery</title> <script src="http://www.google.com/jsapi?key=abqiaaaa1xbmidxx_btcy2_fkph06rragtyh6uml8madna0ykuwnna8vnxqeertaucfkyrr6owbovxn7tdah5q"> </script> <script type="text/javascript"> google.load("jquery", "1"); $(document).ready(function() { var last_valid_selection = null; $('#testbox').change(function(event) { if ($(this).val().length > 5) { alert('you can choose 5!'); $(this).val(last_valid_selection); } else { last_valid_selection = $(this).val(); } }); }); </script> </head> <body style="font-family: arial;border: 0 none;"> <select multiple id='testbox'> <option value='1'>first option</option> <option value='2'>second option</option> <option value='3'>third option</option> <option value='4'>fourth option</option> <option value='5'>fifth option</option> <option value='6'>sixth option</option> <option value='7'>seventh option</option> <option value='8'>eighth option</option> <option value='9'>ninth option</option> <option value='10'>tenth option</option> </select> </body> </html>
Comments
Post a Comment