Topic: Multiselect with option groups not working

Adam Stapleton pro asked 6 years ago


When using a multi-select with option groups in it it doesn't work. It selects items at the incorrect indexes. This causes item 1 and 2 to be selected once mdb renders the select.
<select id="Test" name="Test" multiple class="mdb-select colorful-select dropdown-primary" searchable="Search...">
  <optgroup label="Group A">
    <option value="1">Item 1</option>
    <option value="2">Item 2</option>
    <option value="3">Item 3</option>
  </optgroup>
  <optgroup label="Group B">
    <option value="4">Item 4</option>
    <option value="5" selected>Item 5</option>
    <option value="6">Item 6</option>
  </optgroup>
  <optgroup label="Group C">
    <option value="7">Item 7</option>
    <option value="8">Item 8</option>
    <option value="9">Item 9</option>
  </optgroup>
  <optgroup label="Group D">
    <option value="10" selected>Item 10</option>
    <option value="11">Item 11</option>
    <option value="12">Item 12</option>
  </optgroup>
</select>
Clearly that's incorrect. Any ideas how to fix this issue?

Adam Stapleton pro answered 6 years ago


I've fixed it for you. You need to update the following lines to match the code below. Starting at line 20516.

from this:

if (multiple) {
  $select.find('option:selected:not(:disabled)').each(function () {
    var index = $(this).index();

    toggleEntryFromArray(valuesSelected, index, $select);
    options.find('li').eq(index).find(':checkbox').prop('checked',true);
  });
}

to this:

if (multiple) {
  $select.find('option:selected:not(:disabled)').each(function (i, e) {
    var index = $select.find('option').index(e);

    toggleEntryFromArray(valuesSelected, index, $select);
    options.find('li.active').find(':checkbox').prop('checked',true);
  });
}

Hopefully that allows this fix to be released to others more quickly.


Mikołaj Smoleński staff commented 6 years ago

Thanks a lot for Your remarks!

Mikołaj Smoleński staff answered 5 years ago


Hi there,

It was fixed almost a year ago. Could You udpate Your project to one of the latest versions?

Best regards



I am still experiencing similar issues to what is described here with the tag when using multi-select (as described in this topic). I am using MDB Pro 4.7.4 and would love a solution for a current project.


Mikołaj Smoleński staff answered 6 years ago


Hi Adam,

Thanks for Your remarks. Your issue was added to our list of bugs and we'll try to fix it as soon as possible. For this moment I suggest not to use select with option groups. The other selects are working correctly.

Best Regards



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags