问题描述
当用户单击产品图像ajax时，将产品ID发送到PHP. PHP在MySQL数据库中查找产品并将数据填充到HTML.
When a user clicks on product image ajax send id of product to PHP. PHP find product in MySQL database and fills data into HTML.
问题在于，当PHP填充数据时，该数据在当前页面上不存在. https://ibb.co/DG1sSNz -产品数据为空
The problem is when PHP fill data that data do not exist on the current page. https://ibb.co/DG1sSNz --Product data is empty
数据存储在与index.php相同的另一页中(我在chrome网络标签中找到了数据) https://ibb .co/3SVmyQb
Data is stored in another page same as index.php (I found data in chrome network tab) https://ibb.co/3SVmyQb
我该如何解决这个问题?顺便说一句，这是一个wordpress网站.
How can I solve this problem? And btw this is a wordpress site.
这是带有ajax的jquery代码
This is jquery code with ajax
$(document).on("click touchend", ".product_stake_stapovi, .product_invalidska_kolica, .product_antidekubitni_program, .product_ortoze, .product_mideri, .product_pojas, .product_toaletni_program, .product_bolnicki_kreveti_i_oprema", function (event) {
var product_num_id = $(this).children(".num_id").attr("id"); //Getting id from image element (that is location of real stored id in database)
var product_id = $(this).attr("class");
var product_real_id = product_id.replace("col-3 col ", "");
$.ajax({
method: "POST",
url: "index.php?proizvodi",
data: ({product_num_id:product_num_id}),
success: function(data) {
//console.log(product_num_id);
$(".big_categoryes").fadeOut("fast");
$(".all_products").fadeOut("fast");
$(".product_view_info").fadeIn("smooth");
}
});
});
if(isset($_POST["product_num_id"])) { //ini_set('display_errors',1); //error_reporting(-1); $servername = "localhost"; $username = "medit105_admin"; $password = "s*ib#^Z*3pkL"; $database = "medit105_meditalis"; $dbc = mysqli_connect($servername, $username, $password, $database); //Konekcija na server - bazu podataka mysqli_query($dbc, "SET NAMES utf8"); mysqli_query($dbc, "SET CHARACTER SET utf8"); mysqli_query($dbc, "SET COLLATION_CONNECTION='utf8_unicode_ci'"); #Provera konekcije: if(!$dbc) { die("Connection failed: " . mysqli_connect_error()); } $product_num_id = $_POST["product_num_id"]; $q = "SELECT * FROM meditalis_proizvodi WHERE id = '$product_num_id'"; $r = mysqli_query($dbc, $q); if(mysqli_num_rows($r) > 0) { while($row = mysqli_fetch_assoc($r)) { ?>
<ul class="product">
<li><img src="wp-content/themes/meditalis-to-wp/assets/products/<?php echo $row[" image "]; ?>" alt=" Product Photo"></li>
<li class="informations">
<div class="product_name">
<h4><?php echo $row["name"]; ?></h4></div>
<div class="desc_info">
<p>
<?php echo $row["description"]; ?>
</p>
</div>
<img src="wp-content/themes/meditalis-to-wp/assets/products/<?php echo $row[" size_img "]; ?>" alt="Size Photo">
</li>
</ul>
<?php }
}
//echo $product_num_id;
mysqli_close($dbc);
exit();
}
是否可以在不刷新页面的情况下将新页面中的数据替换为屏幕上的当前页面?
It's possible to replace data from a new page to the current page on screen without a refreshing page?
好的，我将PHP放在页面顶部并在PHP中运行jquery.我使用json_encode作为变量，并尝试使用jquery将数据填充到HTML.但是现在jquery要运行，而php要从数据库中提取数据(idk为什么).
Ok, I put PHP on top of the page and run jquery inside PHP.I used json_encode for variables and try to fill data to HTML with jquery. But now jquery want run and php want pull data from database(idk why).
$product_image = "";
$product_name = "";
$product_description = "";
$product_size = "";
if(mysqli_num_rows($r) > 0) {
while($row = mysqli_fetch_assoc($r)) {
$product_image = "wp-content/themes/meditalis-to-wp/assets/products/" . $row["image"];
$product_name = $row["name"];
$product_description = $row["description"];
$product_size = "wp-content/themes/meditalis-to-wp/assets/products/" . $row["img_size"];
echo '<script>';
echo 'var product_image = ' . json_encode($product_image) . ';';
echo 'var product_name = ' . json_encode($product_name) . ';';
echo 'var product_description = ' . json_encode($product_description) . ';';
echo 'var product_size = ' . json_encode($product_size) . ';';
echo 'alert("dbg");';
echo '$("#product_name_put").html(product_name);';
echo '$("#product_desc_put").html(product_description);';
echo '$("#product_image_put").attr("src", product_image);';
echo '$("#product_size_put").attr("src", product_size);';
echo '</script>';
}
}
这是在网络"标签中输出的:var product_image ="wp-content/themes/meditalis-to-wp/assets/products/invalidska kolica/KOLICA MEHANIcKA EXCEL PLUS.jpg"; var product_name ="Kolica mehanicka excel plus" ; var product_description ="Standardna mehani \ u010dka kolica
\ r \ n \ u0160irine sedi \ u0161ta 36-40-43-46-50 cm
\ r \ n类别:preklopive
\ r \ nTo \ u010dkovi :pune gume napred i pozadi
\ r \ nTe \ u017eina kolica:16kg
\ r \ nNosivost kolica:120kg
\ r \ nProizvo \ u0111a \ u010d:MOVI，Italija
\ r \ n ; var product_size =" wp-content/themes/meditalis-to-wp/assets/products/; alert(" dbg); $("#product_name_put).html(product_name); $("#product_desc_put").html(product_description); $(#product_image_put").attr("src"，product_image); $(#product_size_put").attr("src"，product_size);
This is output in network tab: var product_image = "wp-content/themes/meditalis-to-wp/assets/products/invalidska kolica/KOLICA MEHANIcKA EXCEL PLUS.jpg";var product_name = "Kolica mehanicka excel plus";var product_description = "Standardna mehani\u010dka kolica
\r\n\u0160irine sedi\u0161ta 36-40-43-46-50 cm
\r\nStranice: preklopive
\r\nTo\u010dkovi: pune gume napred i pozadi
\r\nTe\u017eina kolica : 16kg
\r\nNosivost kolica : 120kg
\r\nProizvo\u0111a\u010d: MOVI, Italija
\r\n";var product_size = "wp-content/themes/meditalis-to-wp/assets/products/";alert("dbg");$("#product_name_put").html(product_name);$("#product_desc_put").html(product_description);$("#product_image_put").attr("src", product_image);$("#product_size_put").attr("src", product_size);
推荐答案
在ajax响应中，您将得到HTML.然后，您可以在Ajax成功函数中使用该Ajax响应，并可以将其附加到所需的任何位置，如下所示:
Your will get HTML on ajax response. Then you can use that Ajax response in your Ajax success function and can append that wherever you want as below:
$(document).on("click touchend", ".product_stake_stapovi, .product_invalidska_kolica, .product_antidekubitni_program, .product_ortoze, .product_mideri, .product_pojas, .product_toaletni_program, .product_bolnicki_kreveti_i_oprema", function (event) {
var product_num_id = $(this).children(".num_id").attr("id"); //Getting id from image element (that is location of real stored id in database)
var product_id = $(this).attr("class");
var product_real_id = product_id.replace("col-3 col ", "");
$.ajax({
method: "POST",
url: "index.php?proizvodi",
data: ({product_num_id:product_num_id}),
success: function(data) {
alert(data) //It will have your HTML, you can use this HTML wherever you want.
//console.log(product_num_id);
$(".big_categoryes").fadeOut("fast");
$(".all_products").fadeOut("fast");
$(".product_view_info").fadeIn("smooth");
}
});
});
希望它对您有帮助！
这篇关于用div替换php内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！