AJAX 只响应 php mysqli 数据的第一行。其他行不响应和检索数据。

Question

基本上，此代码通过 studentid 从 id.php 获取信息并返回地址、文档成本等。当单击按钮 student id 时返回代码，但仅针对第一行。第二行没有返回任何数据，我似乎无法找出问题所在。请帮忙。

    <div id="briefinfo" style="display:inline-block;text-align:center;margin-left:20px;">

    <?php require_once("db.php");
        if ($result = $mysqli->query("SELECT * FROM requests WHERE status = 1 ORDER BY id"))
        {
            if ($result->num_rows > 0)
            {
                while ($row = $result->fetch_object())
                {   
                    echo "<div id='thumbnail'>";
                    echo " ". $row->lastname;
                    echo " ". $row->firstname;
                    echo "</div>";
                    echo "document id:" . $row->id;
                    echo "<br>";
                    echo "requested: " . $row->document;
                    echo "<br>";

                    if ($row->paidstatus == 1){
                        echo "payment status: paid";
                    }
                    else{
                        echo "payment status: not paid";
                    }
                    echo "<br>";
                    echo "<input type='button' value='$row->student_id' id='studentid'/>"; 
                    /*echo "<td>" . $row->document . "</td>";
                    echo "<td><a href='records.php?id=" . $row->id . "'>Edit</a></td>";
                    echo "<td><a href='delete.php?id=" . $row->id . "'>Delete</a></td>";
                    echo "<td><a href='unverify.php?id=" . $row->id . "'>unverify</a></td>";
                    echo "<td><a href='comments.php?id=" . $row->id . "'>comment</a></td>";
                    echo "<td>" . $row->paymentamount . " pesos";"</td>";
                    echo "<td><a href='paymentamount.php?id=" . $row->id . "'>set amount</a></td>";*/
                }
            }
            else
            {
                echo "No results to display!";
            }
        }
        else
        {
            echo "Error: " . $mysqli->error;
        } ?>

</div>

这是JS

        <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'></script>    
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script>
        //in your Javascript, put
        $(document).ready ( function () {
        $("#studentid").click (function(){
            var studentid = $(this).val();

            $.ajax({
            type: 'POST',
            url: 'id.php',
            data: {
                id: studentid
            },
            success: function(response) {
                $("#moredata").html(response);
            }
        });
        });
        });
    </script>

这个id.php

    <?php
// connect to the database
include('connect-db.php');
// confirm that the 'id' variable has been set
require_once("db.php");

    $id = $_POST['id'];

    if ($result = $mysqli->query("SELECT * FROM requests WHERE student_id=$id"))
    {
            if ($result->num_rows > 0)
            {

                    while ($row = $result->fetch_object())
                    {
                        echo  $row->paymentamount . " pesos";
                        echo "<br>";
                        echo $row->address;
                        echo "<br>";
                        echo $row->address2;
                        echo "<br>";
                        echo $row->country;
                    }
            }
            else
            {
                echo "No results to display!";
            }
    }
    else
    {
            echo "Error: " . $mysqli->error;
    }
?>

输入按钮的第一行在单击按钮时会显示更多数据。第二行不再显示任何内容。帮助

Answer 1

对于while 循环中的以下语句，您应该使用class 而不是id。您不应该对多个元素使用相同的 ID。

echo "<input type='button' value='$row->student_id' class='studentid'/>"; 

在你的 jquery 脚本中你应该这样称呼它：

<script>
//in your Javascript, put
$(document).ready ( function () {
  $(".studentid").click (function(){
      var studentid = $(this).val();

      $.ajax({
        type: 'POST',
        url: 'id.php',
        data: {
            id: studentid
        },
        success: function(response) {
            $("#moredata").html(response);
        }
       });
  });
});
</script>