Выбранный не работает после вызова AJAX

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.jquery.min.js"></script>
<link href="https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.min.css" rel="stylesheet"/>

HTML

Города

    <select class="form-control select2 chosen-select" id="propertyCity" name="propertyCity[]" style="width:90%;" multiple="multiple" data-tags="true">

<optgroup label="Alajuela">
<option value="Alaj_Alajuela">Alajuela</option>
<option value="Alaj_Atenas">Atenas</option>
<option value="Alaj_Grecia">Grecia</option>
<option value="Alaj_La Fortuna">La Fortuna</option>
<option value="Alaj_La Garita">La Garita</option>
<option value="Alaj_La Guacima">La Guacima</option>
<option value="Alaj_Orotina">Orotina</option>
<option value="Alaj_San Carlos">San Carlos</option>
<option value="Alaj_San Ramon">San Ramon</option>
<option value="Alaj_Upala">Upala</option>
</optgroup>
</select>
</div>

SCRIPT

jQuery(".chosen-select").chosen({
no_results_text: "Oops, nothing found!"})

этот код работает в первый раз, но когда я получаю ответ от ajax и заменяю мои выпадающие значения, то выбранный не работает.

Это мой код успеха функции ajax

success: function( response ) {
$(".townsclss").html(response);
$("#propertyCity").addClass("chosen-select");
$("#propertyCity").trigger("chosen:updated");
$(select).trigger("chosen:updated");
}

Ответ приходит в успехе:

<div id="propertyCityReplace">
<label for="propertyCity" style="width:90px;"> City </label><br />
<select class="form-control select2" id="propertyCity" name="propertyCity[]" style="width:90
%;" multiple="multiple" data-tags="true">

<optgroup label='Limón'>
<option value='Lim_Cahuita'>Cahuita</option>
<option value='Lim_Caribbean Coast'>Caribbean Coast</option>
<option value='Lim_Guacimo'>Guacimo</option>
<option value='Lim_Puerto Limon'>Puerto Limon</option>
<option value='Lim_Puerto Viejo'>Puerto Viejo</option></optgroup>
</select>
</div>

Можете ли вы помочь мне, почему выбранный не работал после вызова ajax?

1

Решение

Так как jQuery(".chosen-select").chosen({… работает только при загрузке страницы. Ajax изменяет элементы DOM, и события исчезают.

У вас есть звонок

jQuery(".chosen-select").chosen({
no_results_text: "Oops, nothing found!"})

после вызова AJAX, сразу после

$("#propertyCity").addClass("chosen-select");
0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]