Select2 Get selected option data

Question

$("#e2").select2("val") returns me the value, but I wan't to get the .$listtypes['name'] . ether from data-name or from the option tag display.

I want to get the option data-name for the selected option, how can I accomplish this?

This is my option generator

foreach($core->list_types() as $listtypes){
echo "
<option 
  data-name='".$listtypes['name'] ."' 
  value='".$listtypes['id']."'>
  ".$listtypes['name'] ."
</option>";
}

Apian

Answer 1

you can use this

$("#e2 option:selected").text();

Whiffet

Answer 2

Try this:

$('#e2').select2('data')

return selected option data

Lycian

Might be worth noting that this returns a javascript array. Documentation link:select2.org/programmatic-control/… – Polky

Answer 3

This work for me:

On simple select2 to get label value:

$('#myVar').select2('data')[0].<name_label_from_data_input>

May be helpful do an data dump from select2 variable:

$('#myVar').on('change', function (evt) {
  if ($('#myVar').select2('val') != null){
    console.log($('#myVar').select2('data')[0]);    
  }
});

And catch your the label's name attribute.

Good luck!

Morrie

I wouldn't call it the "label value" because that implies (to me) $('#myVar').val(), but your answer is very useful because from $('#myVar').select2('data')[0] one can get properties id, text, title, and the underlying option element via the property element. – Allegro

Answer 4

You can use this script

$('#editable-select').on('select2:select', function (e) {
            var data = e.params.data;
            console.log(data);
    alert(data['text']);
});

Lint

Answer 5

Looks that @Kishan and @xploshioOn's answers won't work on v4.0+.

Try this: $("#e2").text().trim()

Tildatilde

Answer 6

Use the attr method .attr("data-name") on your selector.

Bernitabernj