Ajax在循环php时发布数据

Question

对不起，我是初学者。 我对来自 while 循环 PHP 的 ajax 发布数据有一些问题。 这是我的代码。

假设在while循环之后我有5条记录5个按钮，每条记录有不同的发布数据，但是无论我点击这5条记录中的哪个按钮，ajax都只会发送记录的第一条数据，ajax将发送第一条记录数据的相同数据

但是，如果我使用 $(this).val() ajax 将在每条记录中发送正确的数据。

请帮忙。非常感谢。

在 PHP 中。

<?php while($rs = mysql_fetch_array($qr)) { ?>
        <td width="150">
             <input type="text" name="studentid" class="studentid" value="<?=$rs['studentid']?>"/>
      </td>
    <td width="100">
        <select name="ssize" class="ssize">
            <option value="">ไซต์</option>
            <option <?php if($rs['ssize'] == 'S') { ?> selected="selected" <?php } ?> value="S">S</option>
            <option <?php if($rs['ssize'] == 'M') { ?> selected="selected" <?php } ?> value="M">M</option>
        </select>
    </td>
    <button value="<?=$rs['id']?>" class="printBill btn btn-primary">
            <i class="glyphicon glyphicon-duplicate"> </i>
            พิมพ์ใบเสร็จ
    </button>
<?php } ?>

在 JS 中。

$(".printBill").click(function () {
            $.ajax({
            url: "admin_search_save.php",
            data: {
                id:$(this).val(),
                studentid:$(".studentid").val(),
                ssize:$(".ssize").val(),
            },
            success: function (data) {
            }
        });
    });

Answer 1

您需要使用event delegation 来动态添加内容。

$(document).on('click','.printBill',function () {

        // capture input and select value by traversing up into parent(tr),
        // then find element [input, select]
        // this traversing method depend on your table structure
        var studID    = $(this).closest('tr').find('input[name=studentid]').val(),
            ssizeData = $(this).closest('tr').find('select[name=ssize]').val();

        $.ajax({
        url: "admin_search_save.php",
        data: {
            id        : $(this).val(),
            studentid : studID,
            ssize     : ssizeData,
        },
        success: function (data) {
        }
    });
  });