Плагин Jquery Chosen Select не работает в PHP Ответ Ajax

Question

Плагин Jquery Chosen Select не работает в PHP Ответ Ajax

У меня есть два выбранных окна выбора для извлечения значений из базы данных MYSQL

Когда No-1 Select box изменяется, тогда No-2 select box генерируется из ответа AJAX.

Выбранные плагины в No-1 работают отлично. Но когда блок выбора No-2 генерируется из ajax, тогда выбранный плагин не работает в блоке выбора No-2.

main.php

         <div class="control-group">
<label for="textfield" class="control-label">Category<span>*</span></label>
<div class="controls">
<select name="category" id="category" multiple="multiple" class="chosen-select input-medium" required onchange="showSubCat(this.value)">
<option value='1'>Option 1</option>
<option value='2'>Option 2</option>
</select>
<input type='hidden' value='' id='categoryId' name='categoryId'>
</div>
</div>

<div class="control-group">
<label for="textfield" class="control-label">Sub Category</label>
<div class="controls">
<select name="subCat_2" id="subCat_2" multiple="multiple" class="chosen-select input-large">
<option value="">--- Select Sub Category---</option>
</select>
</div>
</div>

JS CODE:

var xmlhttp;
function showSubCat(str){

if( $('#category :selected').length > 0){
//build an array of selected values
var selectednumbers = [];
$('#category :selected').each(function(i, selected) {
selectednumbers[i] = $(selected).val();
});
}
//alert(selectednumbers);
document.getElementsByName('categoryId')[0].value = selectednumbers;
if (str==""){
document.getElementById("subCat_2").innerHTML="";
return;
}
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}
else{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("subCat_2").innerHTML=xmlhttp.responseText;
//alert(xmlhttp.responseText);
console.log(xmlhttp.responseText);
}
}
xmlhttp.open("GET","MYurl.php?catId="+selectednumbers,true);
xmlhttp.send();
}

ajax.php

echo "<option value=''>--- Select Sub Category --- </option>";$sql="SELECT field FROM tableName WHERE condition;
$result = mysql_query($sql) or die('MySql Error' . mysql_error());
while($row = mysql_fetch_array($result)){

echo "<option value='1'> ----- Sub Option 1</option>";}

Дайте мне знать, что я сделал неправильно .. ??

4

ajax jquery jquery-chosen php select

Решение

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

Вам нужно пересобрать selectbox с новыми данными в нем.

            if (xmlhttp.readyState==4 && xmlhttp.status==200){

// bind new data
document.getElementById("subCat_2").innerHTML=xmlhttp.responseText;

// refresh chosen.
$('#subCat_2').trigger("chosen:updated");
}

1

Источник

Accepted Answer

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

$('#subCat_2').trigger('chosen:updated');

после того, как вы обновите свой список.

Если вы посмотрите на страница плагина это указывает на то, что

`Вы можете вызвать несколько событий в исходном поле выбора, чтобы вызвать поведение в Chosen.

selected: updated Это событие должно вызываться всякий раз, когда изменяется базовый элемент выбора Chosen (например, изменение выбранных опций) .`

4