get data-attribute from function

Question

I´m trying to get the data-io attribute from my function.

<input id="42297" class="edit flatpickr-input active" data-io="in" value="14:23" type="text" readonly="readonly">

onChange: function(selectedDates, time, instance){

With this code i can get my input id threw: instance.input.id
But i cannot figure out how to access the data-io attribute.

I´ve tried:

instance.input.data-io
instance.input.data('io')
instance.input.attr('data-io')
instance.input.attr('io')

How should i do?

Answer 1

Use instance.input.dataset.io . More information about data-* attributes here: https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes

Answer 2

Since using jQuery use data-api:

$('#42297').data('io'); // -> in

Keep in mind that id should start with letter.

---

If your instance.input is JS object, convert it to jQuery: $(instance.input).data('io')

Answer 3

If you are using jquery use either .data('io') or attr('data-io') . If using vanilla js, utilise Element.getAttribute() .

 var inp = document.getElementById('42297'); console.log(inp.getAttribute('data-io')); var $inp = $('#42297'); console.log($inp.data('io')); console.log($inp.attr('data-io')); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="42297" class="edit flatpickr-input active" data-io="in" value="14:23" type="text" readonly="readonly">