Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Material Select update selection via javasript?

Gallagher pro asked 5 years ago


I'm using version 4.8.7 (jquery):

Scenario:

Main page is a search function with several selects (materialSelect). After making selections I want to be able to 'save the state" of the selections and show them as selected on the next page that is loaded. A similar form is initialized with the same selects.

I was able to set the option based on the value to 'selected' and everything worked in version 4.7.7 but now it has stopped working.

The basic question is:

If I know the values of the selected options, how can I initialize the select to default to those options showing? I have tried setting 'selected' to true, and various attempts of adding 'active' to the classes, but nothing seems to work. Any guidance would be appreciated? (NOTE: the select has optgroups, not sure if that matters or not)

Expected behavior Setting 'selected' attribute to true on select option should make it the selected/shown value when the materialSelect is initialized.

Actual behavior Setting the 'selected' attribute does not update the selected/shown value when the materialSelect is initialized. Sometimes a value a few options above the 'selected' value is shown instead??? Very odd.


sundance free commented 5 years ago

To 'save states' and show them on a new page, you have to use SESSION variables, and some PHP.


Gallagher pro commented 5 years ago

sundance... I do not have a problem with setting/retrieving state. The problem is that setting 'selected' for an option within a material select that has an optgroup does not function properly. It appears to be a bug as demonstrated in the snippet referenced in my other response below: https://mdbootstrap.com/snippets/jquery/gallagher/1012243


Mikołaj Smoleński staff answered 5 years ago


Thanks for repporting that issue. Sorry for the problems. We'll adding this bug to our TO DO list and try to fix it as soon as possible.

Best regards


Gallagher pro commented 5 years ago

Ok thank you... any chance there may be a workaround in the meantime?

Much appreciated!


Mikołaj Smoleński staff commented 5 years ago

For this moment all I can suggest is to do not use option groups, but I I guess it's not a perfect solution for you. Best regards


Gallagher pro answered 5 years ago


Ok.. after playing around with this some more, it does indeed appear to be a problem when there is at least one optgroup defined. Please see the following snippet for an example:

https://mdbootstrap.com/snippets/jquery/gallagher/1012243

Removing the optgroup results in proper behavior. Adding it back in results in the two options above the selected element being highlighted/active.

Do you have a workaround/fix for this? This happens on 4.8.7 as well as the latest snippet version 4.8.5.

Thanks, Marc



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: 4.8.5
  • Device: Desktop
  • Browser: Chrome
  • OS: Any
  • Provided sample code: No
  • Provided link: No