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 enter image description here

    <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

Popular posts from this blog

Payment information shows nothing in one page checkout page magento -

tcpdump - How to check if server received packet (acknowledged) -