JQuery не выбирает правильное значение для выбранного DropDownList

Question

У меня есть выпадающее меню, которое заполнено и использует выбранный plughin. Если выбрано значение, а не текст, необходимо заполнить страницу. Я пробовал несколько разных способов, но никто не работает.

Разметка:

<select class="chzn-select" data-placeholder=" -- Select Course -- " id="CourseDropDown" name="CourseDropDown"> 
    <option value=""></option> 
    <option value="1">Option 1</option> 
</select> 

Вещи, которые я попробовал:

$('#CourseDropDown').on('change', function() { 
    var courseID = $(this).val(); 
.... 
    var courseID = $('#CourseDropDown').val(); 
.... 
    var courseID = $('#CourseDropDown :selected').val(); 
.... 

Все это возвращает пустую строку.

Я могу получить текст из выбора, делая

var courseID = $(this).text(); 

разметки, очевидно, имеет значение, установленное для выбора. Выбор правильной вещи и возврат текста. Что бы заставить его вернуть пустую строку вместо значения 1.

Answer 1

Это, кажется, от того, как я настраивал выбрал. Вся информация, которую я нашел, заявила, что для того, чтобы показать держателя места в раскрывающемся списке, например «- Выберите« Кое-что »), вам нужно было добавить пустое значение/параметр. Кажется, что это значение переопределяло значение параметров, даже если разметка была правильной и выбрал обработанный .text().

Я удалил дополнительный вариант. Теперь он работает так, как должен, и все еще отображает местозаполнитель.

Answer 2

.val() прекрасно работает для меня, вот фрагмент кода https://jsfiddle.net/20kckhf9/