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

时间:2022-09-27 16:13:54

I'm still very new to php and javascript(ajax) and I've tried looking at various posts and websites trying to find my answer, but to no avail.

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

I'm trying to show all related rows from my database on the front end of a website. My SQL statement is currently picking up all the rows I need, but I can't get it to show all the rows (I can get only one row to show).

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

Can someone guide me a bit and tell me what to do to get it right? My code is as follows:

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

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);

I'm also going to include my javascript(ajax) code to cover my bases:

我还要包含我的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 个解决方案

#1


0  

The reason only one row is showing is because you are only accessing data's first row, you have to iterate on all of its rows to show all of its data. Just like you iterate on all the sql request's result rows in your php file to add them to the $table_data array, you have to iterate on data in your ajax request's success callback, this time outputting the data. You can do this with JQuery's each function.

只显示一行的原因是因为您只访问数据的第一行,您必须迭代其所有行以显示其所有数据。就像迭代php文件中所有sql请求的结果行以将它们添加到$ table_data数组一样,你必须在ajax请求的成功回调中迭代数据,这次输出数据。你可以使用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);
    )};
}
...

#1


0  

The reason only one row is showing is because you are only accessing data's first row, you have to iterate on all of its rows to show all of its data. Just like you iterate on all the sql request's result rows in your php file to add them to the $table_data array, you have to iterate on data in your ajax request's success callback, this time outputting the data. You can do this with JQuery's each function.

只显示一行的原因是因为您只访问数据的第一行,您必须迭代其所有行以显示其所有数据。就像迭代php文件中所有sql请求的结果行以将它们添加到$ table_data数组一样,你必须在ajax请求的成功回调中迭代数据,这次输出数据。你可以使用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);
    )};
}
...