Ajax响应没有成功

Ajax响应没有成功

问题描述:

回报我做了一个Ajax代码空的AJAX功能getFailOutput()一类,但我被困在如何从CSS类products-wrpmyAjax.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; 
?> 
+0

加上'数据类型:“html''并再次尝试运行 – guradio

+0

添加并运行@guradio,当我点击测试成功时它不显示产品 –

+0

响应返回什么? – guradio

$('.products-wrp').html(''); 
$('.products-wrp').hide(); 
$('.products-wrp').html(response); 
$('.products-wrp').show(); 

试试这个

+0

我把它包含在getSuccessOutput()中,但它再次不显示产品 –

+0

尝试console.log(响应)并检查浏览器是否返回任何内容 – Exprator

+0

谢谢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