РЕДАКТИРОВАТЬ 2 Похоже, что это проблема с классом CSS.
РЕДАКТИРОВАТЬ Достаточно странно, что он работает на общедоступной стороне сайта, а не частным лицом.Это должен быть CSS или конфликт с другим плагином.
Позвольте мне вначале сказать, что у меня очень мало опыта работы с jQuery, и я впервые играю с ajax.
Я пытаюсь динамически заполнять раскрывающиеся данные на основе выбора предыдущего раскрывающегося списка.
У меня есть html, который выглядит следующим образом
<label for="employee_type">Employee Type</label>
<select name="employee_type" id="employee_type">
<option value="1" selected="selected">Team Member</option>
<option value="2">Supervisor</option>
<option value="3">Manager</option>
</select>
<label for="manager">Reports To</label>
<select name="manager" id="manager_name">
<option value="0" selected="selected">Please Select Employee Role</option>
</select>
Идея состоит в том, что при выборе роли или типа сотрудника в поле ниже заполняются все менеджеры, которые выше на едуchain.
У меня есть строка выбора MYSQL, написанная с помощью php, которая выводит некоторый json с использованием json_encode
, вывод которого
[{"id":"2","first_name":"John","last_name":"Doe"}]
Это просто массив всех пользователей иих имена и идентификаторы должны быть показаны в массиве.
А вот и хитрая часть - Аякс.Я нашел этот урок , который я модифицировал
// attach a change handler to the form
$("select#employee_type").change(function(){
//get the mininimum employee level
var input = $("select#employee_type").val();
//get the callback url
var ajax_url = "/admin/employee/get_json/"+input;
$.ajax({
url:ajax_url,
data:{ url:escape(ajax_url) },
dataType:"json",
success:function(data){
var select = $('#manager_name');
var options = select.attr('options');
$('option', select).remove();
$.each(data, function(index, array) {
options[options.length] = new Option(array['first_name']+ " "+array['last_name'],array['id']);
})
},
error:function(xhr,err,e){ alert( "Error: " + err ); }
}); // $.ajax()
return false;
}); // .submit()*/
Это работает примерно на 78% пути.Это добавляет правильные параметры и значение.Там, где он терпит неудачу, это то, что если у меня есть $('option', select).remove();
(что необходимо, чтобы гарантировать, что поля не добавляются при каждом изменении поля) Поле удаляется, когда я пытаюсь щелкнуть по нему.Я также думаю, что было бы неплохо удалить выбранную опцию (Пожалуйста, выберите ...).
Любая помощь по этому вопросу будет отличной!