将数据附加到Tbody AJAX

时间:2016-02-13 08:24:44

标签: php jquery ajax

我有一个foreach语句,它将数据从数据库添加到我的table rows

HTML

<table id="myTable" class="display table center-table" width="100%" >
   <thead>  
          <tr>  
            <th>Product #</th>  
            <th>Alternate #</th>  
            <th>Description</th>  
            <th>On Hand</th>  
        <th>Condition</th>
          </tr>  
        </thead>  

    <tbody id="productResults"> </tbody>

</table>

PHP

$query =  $sql . " limit " . $start . "," . $perPage; 
  $data = $db_handle->runQuery($query);

  if(empty($_GET["rowcount"])) {
  $_GET["rowcount"] = $db_handle->numRows($sql);
  }
  $pages  = ceil($_GET["rowcount"]/$perPage);
    $output = '';
  if(!empty($data)) {
  $formval = '<input type="hidden" class="pagenum" value="' . $page . '" /><input type="hidden" class="total-page" value="' . $pages . '" />';
  foreach($data as $k=>$v) {
  $output .= '<tr><td>' . $formval . $data[$k]["wuno_product"] . '</td>';
  $formval = '';
  $output .= '<td>' . $data[$k]["wuno_alternates"] . '</td>';
  $output .= '<td>' . $data[$k]["wuno_description"] . '</td>';
  $output .= '<td>' . $data[$k]["wuno_onhand"] . '</td>';
  $output .= '<td>' . $data[$k]["wuno_condition"] . '</td></tr>';     
}
}
echo $output;

然后在我的用户视图中,我将数据添加回页面,

JQUERY

<script>

(function($) {
$(document).ready(function(){
    function getresult(url) {
    $.ajax({
          url: url,
          type: "GET",
          data:  { rowcount:$("#rowcount").val() },
          beforeSend: function(){
          $('#loader-icon').show();
        },
        complete: function(){
            $('#loader-icon').hide();
        },
        success: function(data){/* convert to dom element */
            $("#productResults").append( data.toElement() );
        },
        error: function(){}             
   });
}

    $(window).scroll(function(){
        if ($(window).scrollTop() == $(document).height() - $(window).height()){
            if($(".pagenum:last").val() <= $(".total-page").val()) {
                var pagenum = parseInt($(".pagenum:last").val()) + 1;
                getresult('<?php echo $assetPath; ?>?page='+pagenum);
            }
        }
    }); 
});
})( jQuery );

</script>

但是当它显示在我的页面中时,它会显示在表格之外并且没有添加html。在页面中看起来像这样,

8855K5MS21026-B2111212M39029/5-1171313Q4559PROD CODE: 4057911RESTOCKING CHARGE11TAS8732-1C277TEST REPORTS6690H549(W) LAMP CKT99MEC-1MF1 FEET DB9M/F CABLE11T1-GMIL-L-25567E1 GAL JUG2121WL-322914VOLT T-1 BULB100100

这是来自数据库的数据,所有这些......为什么会发生这种情况,我该如何解决?     它显示在表格之上。

1 个答案:

答案 0 :(得分:-1)

首先,您尝试添加到表中,但生成的代码的第一部分是表结构外的表单元素;任何现代浏览器都会发现错误并添加假设缺失

  </table> 

这就是响应在表视图之外的原因。