#jquery #ajax
#jquery #ajax
Вопрос:
Я хочу задать значение паре элементов формы в зависимости от значения, выбранного из одного поля выбора с помощью jQuery PHP / MySQL.
Поле выбора вызовет функцию jQuery:
<select name="attr[8]" id="attr[8]"" onchange="set_watch_attr();">
<option value="">auswählen</option>
<option value="132185">116244</option>
</select>
Затем он должен установить значения других полей выбора на основе результата запроса PHP / MySQL:
function set_watch_attr() {
$.ajax({
type: 'POST',
url: 'set_watch_attr.php',
data: 'ref=' $("#attr[8]").val(),
success: function(data) {
data
}
});
}
Поле PHP получает значения для этого конкретного параметра:
// set_watch_attr.php
<?php
// process data and get default values
// output to form
$output = '
$('#attr\[5\]').val(157).change();
$('#attr\[6\]').val(12).change();
';
echo $output;
?>
Почему-то это неправильно, поскольку вывод не имеет никакого эффекта. Я также пытался сделать это наоборот и поместить команды изменения jquery в JS, но я не смог получить массив, который необходим для передачи нескольких значений обратно из вызова ajax.
Как я могу изменить несколько полей выбора при одном вызове?
Ответ №1:
data
Возвращаемый из запроса AJAX является строкой. Вы не можете просто заполнить его JS-логикой в своем PHP-коде и выполнить его на стороне клиента, когда запрос AJAX завершится, как вы, кажется, ожидаете.
Чтобы это сработало, я бы предложил вместо этого возвращать объект из вашего PHP-кода в кодировке JSON. Пары ключ / значение в этом объекте являются идентификатором и значением выбранных элементов, которые вы хотите обновить.
Наконец, обратите внимание, что вы не должны использовать on*
атрибуты события. Они очень устарели, и их следует избегать, где это возможно. Вместо этого используйте ненавязчивые обработчики событий. Поскольку вы уже используете jQuery, вы можете достичь всего этого с помощью следующей логики:
<select name="attr[8]" id="attr[8]" class="set-watch">
<option value="">auswählen</option>
<option value="132185">116244</option>
</select>
<?php
$arr = array('#attr\[5\]'=>157,'#attr\[6]'=>12);
echo json_encode($arr);
?>
$('.set-watch').change(function() {
$.ajax({
type: 'POST',
url: 'set_watch_attr.php',
data: {
ref: $(this).val()
},
success: function(obj) {
Object.keys(obj || {}).forEach(function(k) {
$(k).val(obj[k]).change();
}
}
});
}
Также обратите внимание на общий класс, размещенный на select
, чтобы упростить селектор и упростить его повторное использование.
Комментарии:
1. Интересный подход. Я пытался реализовать, в коде jQuery отсутствуют 2 блокировки, я добавил их, но он не будет циклически перебирать массив. Вместо этого он циклически перебирает строку. alert(obj[k]); выведет 37 изменений, начинающихся с «#», за которыми следует «a» и так далее. оповещение (k); выдаст 37 предупреждений с 1-37. оповещение (obj); выведет: «{«#attr[5]»:157,»# attr[6]»:12}»
2. @merlin Попробуйте использовать JSON.parse для objs перед циклом 🙂
3. Я думал, что где-то должен быть какой-то json_decode 🙂 Спасибо, работает!