Попытка передать переменную из входного радио в PHP через jQuery.post ()
Я пытаюсь загрузить таблицу html, созданную кодом php. Таблица должна быть сгенерирована запросом sql, который зависит от переменной из селектора ввода радио, но каким-то образом я не могу передать эту переменную через jQuery.post (). Я сделал простую версию с той же проблемой, поэтому надеюсь, что кто-то сможет мне с этим помочь:
test.php:
<html>
<head>
<script type = "text/javascript" src = "https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<script type = "text/javascript">
$(document).ready(function(){
$("input[name$='selectOP']").on("change", function() {
var op = $(this).val();
$.post('ajax.php', {varphp: op});
$("#div1").load('ajax.php', function(){
});
});
});
</script>
<body>
<label class = "radio-inline"><input type = "radio" value = "110" name = "selectOP" id = "selectOP">110 </label>
<label class = "radio-inline"><input type = "radio" value = "115" name = "selectOP" id = "selectOP">115 </label>
<div id = "div1">
</div>
</body>
</html>
ajax.php:
<?php
$var= "Something";
echo $var;
//$varphp = $_POST['varphp'];
//echo $varphp;
?>
Итак, с комментариями к двум последним строкам ajax.php код успешно выполняется и var $ var загружается внутри div1. Но если я раскомментирую эти строки, по-видимому, код остановится, и в div1 ничего не будет загружено. Что я делаю неправильно?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
$.post('ajax.php', {varphp: op});
$("#div1").load('ajax.php', function(){
$});
Эти две строки фактически выполняют два отдельных запроса ajax, что означает, что сервер будет получать их отдельно. Только первый имеет параметр POST, и только второй задает содержимое DOM-объекта.
Попробуйте что-то вроде этого:
$("#div1").load('ajax.php', {
varphp: op
});
Вы вызываете $ .post, в котором передаете аргумент, а затем вызываете load без аргументов. Конечно, вы не можете получить $ _POST ['varphp'] при вызове 'load', потому что вы не передаете эту переменную.
вы должны использовать один из них. вы можете сделать с этим:
$.post('ajax.php', {varphp: op}, function(data){ $("#div1").html(data); }, 'html' );
или
$("#div1").load('ajax.php', {varphp: op});
но не оба
таким образом, ваш код может быть
$ (документ) .ready (функция () {
$("input[name$='selectOP']").on("change", function() {
var op = $(this).val();
$.post('ajax.php', {varphp: op}, function(data){ $("#div1").html(data); }, 'html' );
});
});
или
$ (документ) .ready (функция () {
$("input[name$='selectOP']").on("change", function() {
var op = $(this).val();
$("#div1").load('ajax.php', {varphp: op});
});
});
Идеально! Я новичок во всем этом и теперь вижу, что это очевидная ошибка. Большое тебе спасибо.
Мне нравится использовать AJAX с отложенными обещаниями. Вы можете попробовать преобразовать свой код в следующий:
$.ajax({
type: 'post', // you can switch to GET, POST, etc.
url: 'ajax.php',
data: {varphp: op},
})
.done(function(data) {
$('#div1').html(data);
})
.fail(function(data) {
// if your code fails, you can see the errors here in the console
console.info(data);
})
.always(function(data) {
// do something every time
});
Коды в функциях обратного вызова done, fail или always будут выполняться в зависимости от того, является ли вызов AJAX успешным, неудачным или нет, соответственно. Благодаря этому вы также можете легко устранить неполадки в своем коде, особенно когда ошибка вызова AJAX исчезла (загляните внутрь функции fail).
Отлично! Спасибо.
Идеально! Я новичок во всем этом и теперь вижу, что это очевидная ошибка. Большое тебе спасибо.