Datatables, добавление еще одного столбца в набор данных, но не отображение его в таблице - PullRequest
0 голосов
/ 08 сентября 2018

В моей базе данных есть таблица, которую я бы хотел отобразить в 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 в json, который он хочет, заменяет name и name заменяет datecreated. Я искал способ, которым я мог бы включить ID в data, но скрыть и использовать аналогичную логику, которая использовалась В этом официальном учебнике данных , чтобы получить идентификатор и использовать его для удаления нужной строки .

1 Ответ

0 голосов
/ 09 сентября 2018

Хорошо, оказывается, я смотрел на проблему с совершенно другой точки зрения.Это то, что я и сделал.

Сначала я указал имена своих столбцов, у 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 }

    ],

Итакесли вы заметили, что у них нет удостоверения личности, это потому, что их не должно быть.Оказывается, в базе данных есть специальный объект, который называется 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();

В этот момент я успешно вставил данные с их эквивалентными идентификаторами, все, что мне нужно было сделать, - это получить к ним доступ с помощью кнопок, которые я добавил в свои строки. Поэтому я сделал это

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

Взял меня когда-нибудь, но я не могу быть более гордым.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...