javascript - Selecting multiple groups in the dropdown -
i have 1 dropdown consists of list of groups , respective items groups.i want select group automatically groups items should select based on selection of groups in dropdown
here html code :
<select id="example-multiple-optgroups" class="multiselect-group"> <optgroup label="group 1"> <option value="1-1">option 1.1</option> <option value="1-2" selected="selected">option 1.2</option> <option value="1-3" selected="selected">option 1.3</option> </optgroup> <optgroup label="group 2"> <option value="2-1">option 2.1</option> <option value="2-2">option 2.2</option> <option value="2-3">option 2.3</option> </optgroup> </select
and javascript:
$('.multiselect-group').before('<input type="checkbox" />'); $(document).on('click', '.multiselect-group', function(event) { var checkall = true; var $opts = $(this).parent().nextuntil(':has(.multiselect-group)'); var $inactive = $opts.filter(':not(.active)'); var $toggleme = $inactive; if ($inactive.length == 0) { $toggleme = $opts; checkall = false; } $toggleme.find('input').click(); $(this).parent().find('input').attr('checked', checkall); event.preventdefault(); });
i trying these code ,but not getting proper output,please let me know procedure done.
you can achieve using plugin , below code. download js , css file please click here image attached
<head> <link href="css/multiple-select.css" rel="stylesheet"/> </head> <body> <select multiple="multiple"> <optgroup label="group 1"> <option value="1-1">option 1.1</option> <option value="1-2" >option 1.2</option> <option value="1-3" >option 1.3</option> </optgroup> <optgroup label="group 2"> <option value="2-1">option 2.1</option> <option value="2-2">option 2.2</option> <option value="2-3">option 2.3</option> </optgroup> </select> <script src="js/jquery.min.js"></script> <script src="js/multiple-select.js"></script> <script> $("select").multipleselect({ multiple: true, multiplewidth: 100, width: '100%' }); </script> </body>
Comments
Post a Comment