使用Jquery收集数组中的行ID，然后为新表查询这些值

Collecting Row IDs in an Array using Jquery and then Querying those values for a new table

本文关键字：新表 然后 查询 ID Jquery 数组 使用      更新时间：2023-09-26

我正在尝试使用jquery.php设置一个函数，在该函数中，用户在具有特定ID的行中选择一个复选框（该ID与我的数据库中的行数据的主键匹配），将每个行ID存储到一个数组中，然后单击"比较所选行"按钮将其传递到一个新页面，在该页面上只显示那些所选行的结果表。

每个输入看起来像这个

<input type='checkbox' id='$id' class='compareRow'></input>

我是jquery的新手，并计划使用我之前编写的脚本的变体来以模式显示动态行数据。我不确定这段代码是否相关，但它也将行id传递给另一个php页面，以便查询数据库。请注意，这在过去只用于单个查询，因为这个新函数需要在查询级别使用某种foreach语句来处理ID数组。

这是我一直试图调整的脚本

$(function(){
    $('.compareRow').click(function(){
      var ele_id = $(this).attr('id');
       $.ajax({
          type : 'post',
           url : 'query.php', //query 
          data :  'post_id='+ ele_id, // passing id via ajax
       success : function(r)
           {
          other code? 
                     });
           }
         });
    });
    });

我知道这里需要更多，但这正是我迄今为止所拥有的，任何帮助都将不胜感激。

更新，所以我创建了这个页面，并有以下内容：

在我的compareSelected.php中，我有以下代码：

if(isset($_POST['post_id'])){
    $compare_received = $_POST['post_id'];
}
print_r($compare_receive);

它返回未定义的索引。

我还修改了代码，改为类似的页面后：

$('.compareRowButton').click(function(){
          var ids = [];
          //loop to all checked checkboxes
          $('.compareRow:checked').each(function(){
          //store all id to ids
          ids.push($(this).attr('id'));
      });
       $.ajax({
          type : 'post',
           url : 'compareSelected.php', //query 
          data :  {post_id:ids}, // passing id via ajax
       success : function(r)
           {
          window.location = 'compareSelected.php';
           }
         });
    });

不确定为什么它不会拾取数组值。

如果对当前实现进行了设置，则可以在行数组中维护对每个ajax调用返回的数据的引用。稍后，您可以实现一个按钮，该按钮触发一个函数，将行数据附加到表中。当然，在追加之前，您可能需要解析请求返回的数据。

$(function(){
  var rows = [];
  $('.compareRow').click(function(){
    var ele_id = $(this).attr('id');
    $.ajax({
      type : 'post',
      url : 'query.php', //query 
      data :  'post_id='+ ele_id, // passing id via ajax
      success : function(data){
        rows.push(data);
      }
    });
  });
  $('.displayTable').click(function(){
    // append to table or divs
  });
});

我建议你避免在这里重新加载页面。或者，如果必须的话，在下面的页面上发出Ajax请求。您希望避免不同jQuery模块之间的逻辑紧密耦合。Ajax应该用于异步加载数据，而不需要重新加载页面。

关于您的代码。每次单击复选框时发送ajax请求。在发送ajax请求之前，最好制作另一个按钮或其他东西。

$('SOME_ELEMENT').click(function(){
      var ids = [];
      //loop to all checked checkboxes
      $('.compareRow:checked').each(function(){
          //store all id to ids
          ids.push($(this).attr('id'));
      });
       $.ajax({
          type : 'post',
           url : 'query.php', //query 
          data :  {post_id:ids}, // passing id via ajax
       success : function(r)
           {
          other code? 
                     });
           }
         });
    });
相关文章：