Ajax响应没有成功
回报我做了一个Ajax代码空的AJAX功能getFailOutput()
一类,但我被困在如何从CSS类products-wrp
的myAjax.php
显示产品上的AJAX功能getSuccessOutput()
。Ajax响应没有成功
当我点击测试成功链接时,我无法显示myajax.php中的类..请帮助!
<?php
session_start(); //start session
include("config.inc.php"); //include config file
?>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Stores</title>
<link href="style/style1.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" onclick="return getSuccessOutput();"> test success </a>
| <a href="#" onclick="return getFailOutput(); return false;"> test failure</a>
<div id="output">waiting for action</div>
<div align="left">
<script>
function getFailOutput() {
$.ajax({
success: function() {
$('.products-wrp').html('');
},
});
return false;
}</script>
<script>
function getSuccessOutput() {
$.ajax({
url:'myAjax.php',
success: function (response) {
console.log(data, response);
$('.products-wrp').html('');
$('.products-wrp').html(response);
},
});
return false;
}</script>
<?php
//List products from database
$results = $mysqli_conn->query("SELECT product_name, product_desc, product_code, product_image, product_price FROM products_list");
$products_list = '<ul id ="products_list" class="products-wrp">';
while($row = $results->fetch_assoc()) {
$products_list .= <<<EOT
<li>
<form class="form-item">
<h4>{$row["product_name"]}</h4>
<div>
<img src="images/{$row["product_image"]}" height="62" width="62">
</div>
<div>Price : {$currency} {$row["product_price"]}<div></form>
</li>
EOT;
}
$products_list .= '</ul></div>';
echo $products_list;
?>
</body>
</html>
myAjax.php
<?php
//List products from database
$results = $mysqli_conn->query("SELECT product_name, product_desc, product_code, product_image, product_price FROM products_list");
$products_list = '<ul id ="products_list" class="products-wrp">';
while($row = $results->fetch_assoc()) {
$products_list .= <<<EOT
<li>
<form class="form-item">
<h4>{$row["product_name"]}</h4>
<div>
<img src="images/{$row["product_image"]}" height="62" width="62">
</div>
<div>Price : {$currency} {$row["product_price"]}<div></form>
</li>
EOT;
}
$products_list .= '</ul></div>';
echo $products_list;
?>
$('.products-wrp').html('');
$('.products-wrp').hide();
$('.products-wrp').html(response);
$('.products-wrp').show();
试试这个
我把它包含在getSuccessOutput()中,但它再次不显示产品 –
尝试console.log(响应)并检查浏览器是否返回任何内容 – Exprator
谢谢exprator它现在运行 –
您可以使用jQuery load()
方法从特定段内的URL加载数据。 例子:
$("#div").load("page_load.html #sectionToLoad");
你的情况可能是:
function getSuccessOutput() {
$('.products-wrp').load("myAjax.php .products-wrp")
return false;
}
进一步研究和实例去这里 https://www.w3schools.com/jquery/jquery_ajax_load.asp
加上'数据类型:“html''并再次尝试运行 – guradio
添加并运行@guradio,当我点击测试成功时它不显示产品 –
响应返回什么? – guradio