-2

I'm trying to add simple value inside <select> tag. How I can do it?

Below I prepared example how it should look like.

<script>
$(document).ready(function(){

  $("#selectList").add("data-size='12'");

});
</script>

<select class='selectpicker' data-hide-disabled='true' id='selectList'>
</select>


// expected result
<select class='selectpicker' data-hide-disabled='true' id='selectList' data-size='12'>
</select>
connexo
  • 53,704
  • 14
  • 91
  • 128
Filip Pruszyński
  • 11
  • 3
  • `selectList.dataset.size='12'` or `selectList.setAttribute('data-size', '12')` – connexo Sep 25 '18 at 22:13
  • 1
    Possible duplicate of [How to set data attributes in HTML elements](https://stackoverflow.com/questions/13524107/how-to-set-data-attributes-in-html-elements) – devlin carnate Sep 25 '18 at 22:24

2 Answers2

0

This is very easy using vanilla Javascript:

document.addEventListener('DOMContentLoaded', () => {
  selectList.dataset.size='12';
  console.log(selectList);
})
<select class="selectpicker" data-hide-disabled="true" id="selectList"></select>

You can also use selectList.setAttribute('data-size', '12') instead.

In jQuery:

$(document).ready(function() {
  $('#selectList').attr('data-size', '12');
  console.log(selectList);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="selectpicker" data-hide-disabled="true" id="selectList"></select>
connexo
  • 53,704
  • 14
  • 91
  • 128
0

Simply, you can add via prop

$("#selectList").prop('data-size', '12');
Mehmet Hanoğlu
  • 2,942
  • 1
  • 13
  • 19