我在index.php
页面上搜索了一个搜索栏。但我想在coupons.php
上显示结果。如何在AJAX中完成。
注意: #search_result
是coupons.php文件的div,我想显示结果。
AJAX
$("document").ready(function() {
$("#search_form").on("submit", function (e) {
e.preventDefault();
$.post("result.php?query=" + encodeURIComponent($("#list_search").val()), function (data) {
var res = JSON.parse(data);
if (res.divs) {
$('#search_result').html("");
for (var i = 0; i < res.divs.length; i++) {
$('#search_result').append(res.divs[i]);
}
} else {
$('#search_result').html("No matched coupons found !");
}
});
});
});
</script>
答案 0 :(得分:2)
我假设您需要以某种方式在另一个页面上显示结果但不能使用服务器端。我不知道你为什么要这样做,但是ajax肯定不是选项,如果你不能使用服务器端,你可以这样做。而不是在coupons.php页面上发送JSON响应。将搜索查询发送到优惠券页面。所以你应该在index.php中创建一个像这样的搜索表单
<form action="coupons.php" method="GET">
<input type="text" name="query" />
<input type="submit" value="Submit" />
</form>
然后在您的coupons.php页面中,您可以通过 window.location.search 访问您的搜索查询。这将为您提供查询用户搜索
现在使用此查询,在coupons.php页面上,您将编写逻辑以获取json响应并将结果打印在 #search_result 元素中。
所以你的coupons.php会看起来像
$("document").ready(function() {
var q = window.location.search; // q is your query string you got from index.php
$.post('result.php'+q, function (data) {
var res = JSON.parse(data);
if (res.divs) {
$('#search_result').html("");
for (var i = 0; i < res.divs.length; i++) {
$('#search_result').append(res.divs[i]);
}
} else {
$('#search_result').html("No matched coupons found !");
}
});
});