如何通过MySql查询结果中的循环输入表单（动态地）发布Ajax onClick

Posted 2023-02-21

我想就如何通过mysql查询结果中的循环输入形式（动态地）解决Ajax帖子提出建议。

<?php
// Query Result
foreach ($sql->result() as $row) 
echo '
<div class="media mt-4">
  <div class="media-body text-muted text-small">
    <input class="d-none" value="'.$row->cY.'" name="post_X" id="post_X">
    <input class="d-none" value="'.$row->cZ.'" name="post_Y" id="post_Y">
    <div class="input-group">                             
      <input style="background:#fafafa" type="text" name="post_Z" id="post_Z" placeholder="Join conversation here..." class="form-control">
      <div class="input-group-append">
        <button type="button" onclick="addPost()" class="btn btn-outline-secondary"><i class="fa fa-send"></i></button>
      </div>
    </div>
  </div>
</div>';

?>

Ajax脚本

<script>
function addPost() 
    if(!$("#post_Z").val()) 
        // An Alert!
     else 
        var post_X = $("#post_X").val();
        var post_Y = $("#post_Y").val();
        var post_Z = $("#post_Z").val();
        $.post("reply.php", 
            uid: post_X,
            cid: post_Y,
            txt: post_Z
        , function (data, status) 
            // An Alert!
        );
    ;

</script>

非常感谢

答案

为每次迭代提供一个ID，并将该ID添加到addPost事件中，以便该帖子仅根据定义的ID检索数据

将代码更改为这样

<?php
// Query Result

$uniq = 1;
foreach ($sql->result() as $row) 
echo '
<div class="media mt-4">
  <div class="media-body text-muted text-small">
    <input class="d-none" value="'.$row->cY.'" name="post_X_'.$uniq.'" id="post_X_'.$uniq.'">
    <input class="d-none" value="'.$row->cZ.'" name="post_Y_'.$uniq.'" id="post_Y_'.$uniq.'">
    <div class="input-group">                             
      <input style="background:#fafafa" type="text" name="post_Z_'.$uniq.'" id="post_Z_'.$uniq.'" placeholder="Join conversation here..." class="form-control">
      <div class="input-group-append">
        <button type="button" onclick="addPost('.$uniq.')" class="btn btn-outline-secondary"><i class="fa fa-send"></i></button>
      </div>
    </div>
  </div>
</div>';
$uniq++;

?>

和ajax

<script>
function addPost(id) 
    if(!$("#post_Z_"+id).val()) 
        // An Alert!
     else 
        var post_X = $("#post_X_"+id).val();
        var post_Y = $("#post_Y_"+id).val();
        var post_Z = $("#post_Z_"+id).val();
        $.post("reply.php", 
            uid: post_X,
            cid: post_Y,
            txt: post_Z
        , function (data, status) 
            // An Alert!
        );
    ;

</script>

可能有帮助