Topic: Select option with data attribute

meesha81 priority asked 1 month ago


How to get data-var="xxx" of selected option?

It looks that optionSelected.mdb.select do not provide data attributes from original option.

Or is possible to get it in the optionSelected.mdb.select event? Standard select do this.


Grzegorz Bujański staff answered 4 days ago


At the moment, we have no plans to add information about the dataset of the selected item to our events.

You can do this easily using the returned value in the event:

<select id="select" data-mdb-select-init>
  <option data-var="var1" value="1">One</option>
  <option data-var="var2" value="2">Two</option>
  <option data-var="var3" value="3">Three</option>
  <option data-var="var4" value="4">Four</option>
</select>

const selectEl = document.querySelector('#select')
selectEl.addEventListener('optionSelected.mdb.select', (e) => {
  const selectedOptionEl = selectEl.querySelector(`option[value="${e.value}"]`)
  console.log(selectedOptionEl.dataset.var)
})

meesha81 priority answered 4 days ago


Hi, It is very important for me that we need to access also data attributes. It shouldn't be that difficult to pass data attributes, don't you think?


Kamila Pieńkowska staff answered 1 month ago


The optionSelected event return only value of the selected option.



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: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 8.0.0
  • Device: PC
  • Browser: Chrome
  • OS: Win11
  • Provided sample code: No
  • Provided link: No