Javascript select2 selected value is null on first select

Question

I am using select2 for my dropdown menu with bootstrap and bootbox. The problem is that when I show my dropdown and try to select a value for the first time , it returns an empty object. If I reselect some another value, it works ok. Any ideas how this may be fixed?

My code is ass follows

<select name="classSelect" class="form-control classSelect select2-hidden-accessible" id="subject_change_select" tabindex="-1" aria-hidden="true">
  <option value="5">sdfsdfsfsdf</option>
  <option value="6">2</option>
  <option value="7" selected="">1</option>
  <option value="8">3</option>
  <option value="9">4</option>
</select>

$(element).select2({
   language: "en",
   minimumResultsForSearch: 1,
   theme: "classic"
}).select2('open');

I try to get the data with the following code:

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

or

$('#subject_change_select').val()

Answer 1

Use jquery .change() to get the value of the selected input. Then, use .text() to get the textvalue.

 <!DOCTYPE html> <html> <head> <script src="https://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> <script> $( document ).ready(function() { $( "#subject_change_select" ).change(function() { r = $("#subject_change_select option:selected").text(); console.log(r); }); }); </script> </head> <body> <select name="classSelect" class="form-control classSelect select2-hidden-accessible" id="subject_change_select" tabindex="-1" aria-hidden="true"> <option value="5">sdfsdfsfsdf</option> <option value="6">2</option> <option value="7" selected="">1</option> <option value="8">3</option> <option value="9">4</option> </select> </body> </html>

Javascript select2 selected value is null on first select

Question

1 answers

solution1
1 ACCPTED 2017-05-23 17:48:28

Javascript select2 selected value is null on first select

Question

1 answers

solution1 1 ACCPTED 2017-05-23 17:48:28

solution1
1 ACCPTED 2017-05-23 17:48:28