使用php / javascript(ajax)从数据库(SQL)显示多行到网站的前端

时间:2016-09-04 20:31:17

标签: javascript php jquery mysql ajax

我还是非常新的php和javascript(ajax),我试过看各种帖子和网站试图找到我的答案,但无济于事。

我正在尝试在网站前端显示我数据库中的所有相关行。我的SQL语句当前正在拾取我需要的所有行,但我无法显示所有行(我只能显示一行)。

有人可以指导我一点并告诉我该怎么做才能做到正确吗?我的代码如下:

PHP -

$result = mysql_query("SELECT lot_num, buyer_id, item_desc, quantity, price FROM auction_items where auction_id = (SELECT id FROM auction ORDER BY date_created desc Limit 1) ORDER BY id DESC");          //query

    $table_data = array();
   while($row = mysql_fetch_array($result)){
       $table_data[]= (array('lot_num' => $row["lot_num"], 'buyer_id' => $row["buyer_id"], 'item_desc' => $row["item_desc"], 'quantity' => $row["quantity"], 'price' => $row["price"]));
    }
   // $array = mysql_fetch_row($result);    

    echo json_encode($table_data);

我还要包含我的javascript(ajax)代码来覆盖我的基础:

$("#submit").click(function(){
    $.ajax({                                      
        url: 'auctionItemLoad.php',      //the script to call to get data          
        dataType: 'json',                //data format      
        success: function(data)          //on recieve of reply
        {
            var lot_num = data[0];              
            var buyer_id = data[1];           
            var item_desc = data[2];
            var quantity = data[3];
            var price = data[4];
            $('#lot_num_result').html(lot_num);
            $('#buyer_id_result').html(buyer_id);
            $('#item_desc_result').html(item_desc);
            $('#quantity_result').html(quantity);
            $('#price_result').html(price);
        }
        });
    });

1 个答案:

答案 0 :(得分:1)

只显示一行的原因是因为您只访问数据的第一行,您必须迭代其所有行以显示其所有数据。就像你迭代php文件中所有sql请求的结果行将它们添加到$table_data数组一样,你必须在你的ajax请求中成功迭代data回调,这次输出数据。你可以使用JQuery的每个函数来完成这个任务。

...
success: function(data) {
    $.each(data, function(i, row) {
        var lot_num = row.lot_num;              
        var buyer_id = row.buyer_id;           
        var item_desc = row.item_desc;
        var quantity = row.quantity;
        var price = row.price;

        $('#lot_num_result').append(lot_num);
        $('#buyer_id_result').append(buyer_id);
        $('#item_desc_result').append(item_desc);
        $('#quantity_result').append(quantity);
        $('#price_result').append(price);
    )};
}
...