Multiselect is not working anymore


Topic: Multiselect is not working anymore

giorgio.ponza pro premium priority asked 7 years ago

From version 4.4.3, the multiselect is not working as expected. If you open your demo page JavaScript / Select, and you choose Option 2 & Option 3 on the multiselect, it will check Option 1 & Option 2. It seems that the previous option is checked. With version 4.4.1 the multiselect was working as expected

giorgio.ponza pro premium priority commented 7 years ago

I investigated the problem. There is this line in mdb.js selected = toggleEntryFromArray(valuesSelected, $(this).index() - 1, $select); If i delete the -1, the multiselect works as expected. I don't know if this is the right solution, but it's a start :D

Mikołaj Smoleński staff answered 7 years ago

The correct solution is to change in mdb.js code line from selected = toggleEntryFromArray(valuesSelected, $(this).index() – 1, $select) to selected = toggleEntryFromArray(valuesSelected, $(this).index(), $select); Exactly as Giorgio.Ponza wrote in his reply. Regards

giorgio.ponza pro premium priority commented 7 years ago

Hi Mikołaj, this bug is still present in MDB JQuery 4.4.4. The correction was not that difficult, so i am a bit disappointed it's not still corrected. :D

Mikołaj Smoleński staff commented 7 years ago

Sorry Giorgio. It is our omission. We'll try not to forget it in the next release

ozcanarslan pro commented 7 years ago

This bug still exist in lates 4.4.5 Jquery version.

fra commented 7 years ago

It seems that the fix proposed will solve the issue, but it breaks when the Multiselect has a Searchbox. Probably something like this works better: <pre>var index = (searchable) ? $(this).index() -1 : $(this).index(); selected = toggleEntryFromArray(valuesSelected, index, $select);</pre>

Mikołaj Smoleński staff answered 7 years ago

We are currently working on it. Please be patient.
For this moment You can change part of our file to this:

if (multiple) {
$('input[type="checkbox"]', this).prop('checked', (i, v) => {
return!v
})
if(searchable) {
if(optgroup) {
selected=toggleEntryFromArray(valuesSelected, $(this).index() -$(this).prevAll('.optgroup').length-1, $select)
} else {
selected=toggleEntryFromArray(valuesSelected, $(this).index() -1, $select)
}
} else if(optgroup) {
selected=toggleEntryFromArray(valuesSelected, $(this).index() -$(this).prevAll('.optgroup').length, $select)
} else {
selected=toggleEntryFromArray(valuesSelected, $(this).index(), $select)
}
$newSelect.trigger('focus')
} else {
options.find('li').removeClass('active')
$(this).toggleClass('active')
$newSelect.val($(this).text())
}

Regards


Mikołaj Smoleński staff commented 7 years ago

You should also add this code before: // Check for optgroups var optgroup = false if($select.find('optgroup').length) { optgroup =true }

Mikołaj Smoleński staff commented 7 years ago

And finally, the last change: From: select.siblings('ul.dropdown-content').find('li').eq(entryIndex).toggleClass('active') To: select.siblings('ul.dropdown-content').find('li:not(.optgroup)').eq(entryIndex).toggleClass('active')

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
  • User: Pro
  • Premium support: Yes
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No