的jQuery/Ajax請求，並顯示所選記錄

我想知道如何jQuery的/ AJAX可以將查詢發送到服務器，然後讓服務器（PHP）calculte響應，並將其與附加到網頁的jQuery /阿賈克斯再次？的jQuery/Ajax請求，並顯示所選記錄

實施例：我有3種產品與每個產品的詳細信息（名稱，描述和圖像）數據庫。我有一個鏈接，這3種產品的網頁，我想只顯示用戶點擊的產品細節的jQuery/AJAX：

HTML：

<nav> 
    <ul> 
     <li><a href="#prod1">prod1</a></li> 
     <li><a href="#prod2">prod2</a></li> 
     <li><a href="#prod3">prod3</a></li> 
    </ul> 
</nav> 
<div></div>

$(document).ready(function() { 
    $('a').click(function(){ 
     $('div').load("products.php"); 
    }); 
});

這是什麼我的products.php文件看起來像：

<?php 
try 
    {$bdd = new PDO('mysql:host=localhost;dbname=ddb', 'root', '');} 
catch (Exception $e) 
    {die('Error : ' . $e->getMessage());} 
$reponse = $bdd->query('SELECT * FROM products ORDER BY id DESC') or die(print_r($bdd->errorInfo())); 
?> 

<div class="prod_details"> 
    while ($data = $reponse->fetch()){ ?> 
     <h1><?php echo $products['name']; ?></h1> 
     <p><?php echo $products['description']; ?></p> 
     <img src="<?php echo $products['image_path']; ?>"> 
    <?php }?> 
</div>

這顯示所有p產品，我怎樣才能得到只顯示點擊產品？

來源

2013-10-01 web-tiki

這裏有一些錯誤。首先你的js：

$('.div').load("products.php");

會嘗試加載products.php到一個div類的元素不進入div元素。

其次，它會嘗試從同一目錄位置作爲您的js腳本加載products.php。你可能想要做/products.php，然後將products.php放在根目錄下。

最後，因爲你需要在你的LI標籤的UL或OL標記你的HTML不正確。

爲了讓PHP返回個別產品，您需要將產品ID傳遞給你的PHP，然後修改SQL查詢接受WHERE ID子句。是這樣的：

HTML：

<nav> 
    <ul> 
    <li><a href="#prod1" data-id="1">prod1</a></li> 
    <li><a href="#prod2" data-id="2">prod2</a></li> 
    <li><a href="#prod3" data-id="3">prod3</a></li> 
    </ul> 
</nav> 
<div></div>

JS：

$(document).ready(function() { 
    $('a').click(function(){ 
     $('div').load("products.php?id=" + $(this).attr('data-id')); 
    }); 
});

然後你的PHP查詢應該是：

$id = $_GET['id']; 
query("SELECT * FROM products WHERE `id` = '$id' ORDER BY id DESC")

這應該爲你做它，帶着幾分的小提琴。

來源

2013-10-01 10:04:20

sonds不錯，我會盡快嘗試。對編碼錯誤感到抱歉，我會更正。 –

它工作正常，答案接受，thx非常多。還有一個問題：如何在加載查詢結束時設置一個變量？像這樣：$（'div'）。load（「products.php？id =」+ var）;儘管我的變量已被定義，但我始終得到一個空值eaven ... –

你所描述的方法是正確的。如果你真的陷入困境，你將需要發佈一個全新的問題。 –

添加的ID標籤，這將是產品ID，然後將產品ID傳遞到jQuery的負載如下：

$('.div').load("products.php?prodid=" + $(this).attr('id'));

在PHP中，做了$ _GET [「PRODID」]來獲得點擊的產品id，並修改您的查詢以使用WHERE子句。

現在，不要期望完整的解決方案，你可以把它關閉從這裏開始。

來源

2013-10-01 09:54:50 Rajesh

的jQuery/Ajax請求，並顯示所選記錄

回答

相關問題