How to get a data-attribute of a select element with javascript

Question

i've the following select box

<select class="selectpicker display-block tax main-tax" name="my_selectbox_name" multiple="" data-none-selected-text="mytext" >
<option value="my_option_value" data-myid="123">my_text</option>
...
</select>

I access to the value in this way

response.my_selectbox_name = $('.main select.tax').selectpicker('val');

How i can access the data-myid value?

developer.mozilla.org/en-US/docs/Web/API/HTMLElement/dataset — jmargolisvt
– jmargolisvt, Commented Dec 6, 2018 at 19:26

Katrpilar · Accepted Answer · 2018-12-06 19:31:49Z

1

Jquery has a .data() method built in for either getting or setting values for a data attribute. When this method is provided with a key like .data(key) it will return the value stored in the data attribute. So for your particular example it would be .data('myid'). For data attributes anything after 'data-' is considered the key. So for your <select data-none-selected-text="mytext"> the key is 'none-selected-text'

But to answer your direct question it looks like this:

$('.selectpicker option').data('myid')

answered Dec 6, 2018 at 19:31

Katrpilar

1,0217 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Sk. Over a year ago

possible selected... $('.selectpicker option:selected').data('myid')

user10756019 · Accepted Answer · 2018-12-06 19:29:02Z

0

There are several ways.

1. the way to get value
$("option").attr("data-myid"); // 123
$("option").dataset.myid; // 123
2. the way to set value
$("option").attr("data-myid", "YOUR_VALUE"); // YOUR_VALUE

answered Dec 6, 2018 at 19:29

user10756019

Collectives™ on Stack Overflow

How to get a data-attribute of a select element with javascript

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related