MDB-SELECT set value programmatically

Topic: MDB-SELECT set value programmatically

Petr Urban priority asked 5 years ago

Hi, is there any option how to set selected value for mdb-select programatically? I need this to be able to restore the value from localStorage historical value. Thanks, Petr

Add comment

Jakub Strebeyko staff answered 5 years ago

1 0 Best answer

Please insert min. 20 characters.

Hi there Petr,

Welcome to the Support Board and thank for reaching out! So - yeah, you can have an option selected initially using the props object passed in to :options. There, you can set and customize your select options on per option basis. Have a look:

          <mdb-select :options="options" />`
          ...
          options: [
            { text: 'Option nr 1', value: 'Option 1' }, 
            { text: 'Option nr 2', value: 'Option 2' }, 
            { text: 'Option nr 3', value: 'Option 3' , selected: true}, 
            { text: 'Option nr 4', value: 'Option 4' }, 
          ]

That way your select will get rendered with the third option selected - hope it helps your case!

With Best Regards, Kuba

Petr Urban priority commented 5 years ago

Hi Kuba,thanks, this is working fine, but I need to reload the options in 'created()', I was trying to setup the historical values from localStorage in 'mounted()' step and that was wrong.

BR,Petr

Jakub Strebeyko staff commented 5 years ago

Hi Petr, am I getting you correctly in that you are trying to retrieve localStorage content in created() hook rather than mounted()? The examples I came across did it in mounted(), too

Best, Kuba

Add comment

Write

Create snippet

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: Priority
Premium support: Yes
Technology: MDB Vue
MDB Version: 5.1.0
Device: MacBook
Browser: Safari
OS: Mac OS
Provided sample code: No
Provided link: No

Petr Urban

54Support score
18Questions 1Answers 1Snippets