AJAX запрос обратного вызова с использованием jQuery
Я новичок в использовании jQuery для работы с AJAX, и написал базовый скрипт для понимания основ. В настоящее время я отправляю запрос AJAX в тот же файл, и я хочу выполнить дополнительную обработку на основе результатов этого вызова AJAX.
Вот мой код:
**/*convertNum.php*/**
$num = $_POST['json'];
if (isset($num))
echo $num['number'] * 2;
?>
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<style type="text/css">
td {border:none;}
</style>
</head>
<body>
<table width="800" border="1">
<tr>
<td align="center">Number To Send<br /><input type="text" id="numSend" size="40%" style="border:2px solid black;"></td>
<td align="center">Number Returned<br /><input type="text" id="numReturn" size="40%" readonly></td>
</tr>
<tr><td align="center" colspan="4"><input type="button" value="Get Number" id="getNum" /></td></tr>
</table>
<script>
$(document).ready(function () {
$('#getNum').click(function () {
var $numSent = $('#numSend').val();
var json = {"number":$numSent};
$.post("convertNum.php", {"json": json}).done(function (data)
{
alert(data);
}
);
});
});
</script>
</body>
</html>
Вот ответ, который я получу, если введу число "2":
4
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<style type="text/css">
td {border:none;}
</style>
</head>
<body>
<table width="800" border="1">
<tr>
<td align="center">Number To Send<br /><input type="text" id="numSend" size="40%" style="border:2px solid black;"></td>
<td align="center">Number Returned<br /><input type="text" id="numReturn" size="40%" readonly></td>
</tr>
<tr><td align="center" colspan="4"><input type="button" value="Get Number" id="getNum" /></td></tr>
</table>
<script>
$(document).ready(function () {
$('#getNum').click(function () {
var $numSent = $('#numSend').val();
var json = {"number":$numSent};
$.post("convertNum.php", {"json": json}).done(function (data)
{
alert(data);
}
);
});
});
</script>
</body>
</html>
Очевидно, я заинтересован только в получении и использовании числа "4", поэтому у меня возник вопрос: как лучше указать, какие именно данные я хочу вернуть?
Некоторые мысли у меня были:
- оборачивая весь мой HTML в оператор if (т. е. если $num isset, НЕ выводить html; иначе выводить HTML), но тогда я повторяю HTML, и я бы предпочел этого не делать.
- Настройка отдельного сценария PHP для получения моего вызова AJAX: это было то, что я делал изначально, и он работает просто отлично. Тем не менее, я заинтересован в том, чтобы хранить все в одном файле, и хотел изучить возможные способы сделать это.
Я уверен, что есть элегантный способ сделать это. Спасибо за любые предложения!
5 ответов
Элегантный способ будет иметь отдельный (!) PHP-файл, который будет выводить только number times 2
часть вашего текущего PHP. Затем вы генерируете запрос AJAX из вашего текущего PHP в новый отдельный PHP.
Я считаю, что этот пост отвечает одному аспекту того, что вы видите, - отражению всей страницы в вашем окне предупреждения.
Далее, вот несколько хороших сообщений для получения основ AJAX:
Заполните раскрывающийся список 2 на основе выбора в раскрывающемся списке 1
Вы могли бы добавить die();
после того, как вы отобразите номер, если вы действительно хотите сохранить его на той же странице. Это прекратит выполнение скрипта. Не забудьте добавить скобки вокруг оператора if:
if (isset($num)) {
echo $num['number'] * 2;
die();
}
Это, однако, не самое элегантное решение.
ПРИМЕЧАНИЕ. * Лучший подход - хранить подобные вещи в отдельном файле, чтобы их было легче читать и понимать, особенно если вы используете хорошее преобразование имен.
Это плохой процедурный подход, но я иду:)
<?php
$num = $_POST['json'];
if (isset($num))
echo ($num['number'] * 2);
die();
?>
или еще лучше:
<?php
$num = $_POST['json'];
if (isset($num))
die($num['number'] * 2); //In case of error you could put them in brackets
?>
PS как альтернатива die();
вы могли бы использовать exit();
они оба делают одно и то же: прекращают дальнейшее выполнение
Я не знаю, насколько это эффективно, но вы можете сделать что-то вроде:
<?php
/*convertNum.php*/
$num = isset($_POST['json']) ? $_POST['json'] : NULL; //you have errors in this line
if (!is_null($num)){
echo $num['number'] * 2;
exit(); //exit from script
}
?>