数据表,在数据集中添加另一列,但不在表中显示

Njo Digits

我的数据库中有一个表格,我想在中显示内容datatable该表有3列id, name and datecreated我希望用户能够通过单击delete button每行中的来从此表中删除行,因此其图形表示如下

|name |title| date|Delete Button|

在我像这样设置内容之前datatable,只需拉动数据库中的所有行并iterating遍历它们,就可以在其中加载数据

                       <table id="example23" class="display nowrap table table-hover table-striped table-bordered" cellspacing="0" width="100%">
                         <thead>
                            <tr>
                            <th>Name</th>
                            <th>Delete</th>
                            </tr>
                            </thead>

                            <tfoot>
                            <tr>
                            <th>Name</th>
                            <th>Delete</th>
                            </tr>
                            </tfoot>
                            <?php foreach ($messages as $message) {?>
                             <tr class="info">
                            <td><?php echo  $message['name']; ?> </td>
                            <td> <?php echo date('d-M-Y', strtotime($message['datecreated'])); ?></td>
                             <td><a href="<?php echo  $_SERVER['PHP_SELF'].'?delete='.$message['id']; ?>"
                            <form   method="get">
                            <button class="btn btn-success btn-rounded" type="button" type="submit" name="submit">DELETE</button>
                            </form>
                            </td> 
                            </tr>
                            <?php } ?>
                        </table>

这很容易,但是加班时间我发现它对1000多个行不利,它的表现确实很差,所以我决定switch to server side processing使用Ajax发出这样的请求

('#example123').DataTable({   
  "bProcessing": true,
     "ajax":{
        url :"../public/messages", 
        type: "POST",  
       error: function(xhr, status, error) {
          console.log('Error::'+xhr.responseText);
           $('#loader').hide();
        },

        beforeSend: function(){
            $('#loader').show();
        },
        complete: function(){
            $('#loader').hide();
        }
      },

用我的后端设置

   public function fetchMessages($draw, $start, $length, $query, $orderColumn, $orderDir){

//*getting total number records without any search
$sql = "SELECT id, name, datecreated from messages";
$stmt = $this->conn->prepare($sql);
$stmt->execute();
$stmt->store_result();
$totalData = $stmt->affected_rows;
$totalFiltered = $totalData; 

//*Search
$sql = "SELECT id, name, datecreated from messages";
if(!empty($query)) {
    $query = "%{$query}%";  
    $sql.=" WHERE name LIKE ? )";

$stmt = $this->conn->prepare($sql);
$stmt->bind_param("sss", $query, $query, $query);
}
$stmt->execute();
$stmt->store_result();
$totalFiltered = $stmt->affected_rows;


$sql.=" ORDER BY ". $orderColumn."   ".$orderDir."  LIMIT ".$start." ,".$length."  ORDER BY e.datecreated DESC";   
$stmt->execute();
$events = array();
$stmt->bind_result($id, $name, $datecreated);



    while($stmt->fetch()) 
    {
        $message = array();
        //$message[] = $id; Once I include id, it goes into the name column and the name goes into the datecreated column
        $message[] = $name; 
        $message[] = $datecreated; 
        $messages[] =  $message;

    }

 $json_data = array(
        "draw"            => intval($draw),
        "recordsTotal"    => intval($totalData), 
        "recordsFiltered" => intval($totalFiltered),
        "data"            => $messages 
        );   

return $json_data;
}

这样就可以加载数据了。我的问题与第一个解决方案不同,在第一个解决方案中,我使用ID删除了该表中没有ID的内容,当我ID在其中包含json要替换namename替换的那一刻datecreated我一直在寻找一种方法,可以将其包括IDdata尚未隐藏的地方,并使用与本官方数据表教程中所使用的类似的逻辑来获取ID并使用其删除所需的行。

Njo Digits

好的,事实证明我是从一个非常不同的角度来看这个问题。这就是我所做的。

首先,我指定了列名,该列名columns names应与JSON来自数据库的列名相同

         "columns": [
        { "data": "title" },
        { "data": "location" },
        { "data": "tickettypes" },
        { "data": "eventtype" },
        { "data": "starts",
          "type" : "date",
            "render": function (data) {
                var date = moment(data).utc().format('DD MMM, YY [at] hh:mm A');
            return date;
        } },
        { "data": "ends",
          "type" : "date",
            "render": function (data) {
                var date = moment(data).utc().format('DD MMM, YY [at] hh:mm A');
            return date;
        } },
        { "data": "datecreated",
         "type" : "date",
            "render": function (data) {
                var date = moment(data).utc().format('DD MMM, YY [at] hh:mm A');
            return date;
        }
    },
        { "data": null }

    ],

因此,如果您注意到它们不是ID,那是因为不应存在。事实证明,一个DataTable有一个叫做特殊的对象DT_RowId,这是其中一个可以使用自己指定的row ID,所以我做到了,我插入我ids喜欢

 $event = array();
        $event["DT_RowId"] = $id;
        $event["title"] = strlen($title) > 70 ? substr($title, 0, 70)."..." : $title; 
        $event["location"] = strlen($address) > 70 ? substr($address, 0, 70)."..." : $address; 
        $event["tickettypes"] = strlen($tickettypes) > 70 ? substr($tickettypes, 0, 70)."..." : $tickettypes;  
        $event["eventtype"] = $eventtype;
        $event["starts"] = $starts;
        $event["ends"] = $ends; 
        $event["datecreated"] = $datecreated; 
        $events[] =  $event;

    $response = array(
        "draw"            => intval($draw),
        "recordsTotal"    => intval($totalData), 
        "recordsFiltered" => intval($totalFiltered),
        "data"            => $events);   
$stmt->close();

至此,我已经成功插入了具有相同ID的数据,我所要做的就是使用添加到行中的按钮访问它们,所以我做到了

 $('#eventTable tbody').on( 'click', '#btndelete', function () {
   var data = table.row($(this).closest('tr')).data()
   data['DT_RowId'];//
} );

有时候拿了我,但我再也没有比这更骄傲了。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

在数据表的开头添加一列

使用另一列的位置在数据表中设置字符串列

如何在数据表的一列中显示json数组?

如何像在同一列中那样在数据表中显示group_concat()列?

GridView不在数据表中显示所有列

添加一个按钮以在数据表中显示其他数据

访问数据表中另一列中的数据

无法使用 onclick 函数从数据表中获取另一列数据?

如何在我的数据表中添加一列以显示多个其他列的值的总和?

R在数据表中循环添加列

在数据表中添加行

Vue.js数据表仅在第一列中显示数据

按五列匹配数据表以更改另一列中的值

根据另一列提取R数据表中的唯一行

根据R中的另一个表在数据集中创建“标志”列

根据另一参考表在数据框中的一列中插入值

如何在数据表的第一列标题中添加一条垂直线?

从数据表中删除第一列

根据另一列中的选择,primefaces 更改数据表中一列的编辑器

数据表,如何让一列用图标对另一列进行排序?

在数据透视表中设置一列作为另一列的百分比

在数据表中切换列后设置前一列宽

C# 数据表。比较一列中的数据,如果匹配,则追加相应行的另一列中的数据

在数据表中显示数据 - Laravel & PHP

Highcharts导出数据:在数据表中显示注释

想要在数据表中有一列包含图像的列;它适用于URL,但不适用于本地路径

如何在数组C#中保存数据表第一列

如何使用Jquery在数据表中选择一列

使用一列中的公式和另一列中的操作数数据将列添加到现有数据表中