使用 serverSide 后,带有 Ajax 的 DataTable 无法正常工作:true [英] DataTable with Ajax is not working well after use serverSide: true
问题描述
我有一个使用 DataTables 的用户表,它将包含 200 多行.当我使用 DataTables 作为默认 "pageLength": 10
时,它看起来很好,这是表格示例.
用户名 |类型 |请求 |用户01 1 请求01用户02 1 请求02用户03 2 请求03用户04 1 请求04用户05 1 请求05用户06 1 请求06用户07 1 请求07用户08 1 请求08用户09 1 请求09用户 10 1 请求 10
显示 200 个条目中的 1 到 10 个
第一个上一个123...20下一个最后
因此,为了减少加载时间,我决定使用 "processing": true
和 "serverSide": true
.然后我遇到了这个 "serverSide" : true
的问题,它在表中打印了 200 行数据.
显示 0 到 0 个条目,共 0 个条目(从 NaN 总条目中过滤)
.然后分页仍然打印,在我单击页面 2 后,它什么也不做.
我不想让 DataTables 获取第一个数据,点击 2 分页后,它会再获取 10 个数据,依此类推.
我正在使用 CodeIgniter,这是我的代码:
在我的 Views + Js 上:
注意:任务是一个不同的组,例如 Class 1 或 Class 2、Orchard University 或Harvard University
在我的控制器上:
$task = $this->input->post('task', TRUE);$user_request = $this->model->all_user_request(task);foreach ($user_request as $ur){$arr = 数组();$arr[] = $ur-> 用户名;$arr[] = $ur->type;$arr[] = $ur->request;$数据[] = $arr;}$输出=数组(数据" =>$数据);如果(计数($ 输出)> 0){回声 json_encode($output);}
在我的模型上:
public function all_user_request($task_id) {$query = "SELECT * FROM user_request WHERE task_id = ?";返回 $this->db->query($query, $task_id)->result();}
注意:在模型中实际上使用了 2 个 INNER JOIN
,我只是简化了仅用于在这里询问的选择.(这里只变成非规范化表)
我试图将 draw
、recordsTotal
、recordsFiltered
添加到我的控制器中的 $output
仅使用数字数据.示例
$output = 数组(画"=>5、记录总数"=>5、记录过滤" =>5、数据" =>$数据);如果(计数($ 输出)> 0){回声 json_encode($output);}
我一直在寻找答案,但我认为问题就在这里,但我仍然不知道我必须在哪里获得 draw
- recordsTotal
- 记录过滤的
数据.我在其他人的另一个答案中看到,他们使用 "draw" =>$_POST['draw']
,然后我试了一下,它什么也不做.
所以我正在尝试使用数字数据,但结果仍然相同.我需要一些帮助.它仍然在表格中打印 200 行数据.
显示 0 到 0 个条目,共 0 个条目(从 NaN 总条目中过滤)
.然后分页仍然打印,在我单击页面 2 后,它什么也不做.
数据表发送您需要的一切 - 如果您查看网络下的控制台,您会发现它们使用 ajax-get 方法发送这些请求到服务器
GET
参数如下
绘制列开始长度搜索
<块引用>
您可以在此处找到整个列表
这意味着 - 您必须正确调整模型...
这样的东西应该可以工作
public function all_user_request($task_id){$intStart = intval($this->input->get("start"));$intLength = intval($this->input->get("length"));$strSearch = (strlen($this->input->get("search")["value"]) >= 2) ?$this->input->get("search",true)["value"] : false;$order = $this->input->get("order",true);$this->setQuery($task_id,$strSearch);$query = $this->db->get();$this->recordsTotal = $query->num_rows();$this->setQuery($task_id, $strSearch);如果 ($intStart >= 0 && $intLength > 0){$this->db->limit($intLength,$intStart);}$strOrderField = '用户名';$strDirection = "ASC";如果 (is_array($order)){开关($order[0]['column']){情况1:$strOrderField = '类型';休息;案例2:$strOrderField = '请求';休息;}if (!empty($order[0]['dir'])) $strDirection = $order[0]['dir'];}$this->db->order_by($strOrderField,$strDirection);$query = $this->db->get();$arrData = $query->result();返回 $arrData;}公共函数 getRecordsTotal(){返回 $this->recordsTotal;}私有函数 setQuery($task_id, $strSearch=""){$this->db-> 选择('*')-> from('user_request')-> where('task_id', $task_id);如果 (!empty($strSearch)){$this->db->like('task_id', $strSearch);}}
和你的控制器
//控制器$task = $this->input->post('task', TRUE);$user_request = $this->model->all_user_request($task);$数据 = [];foreach ($user_request as $ur){$数据[] = [$ur-> 用户名,$ur-> 类型,$ur->请求];}$arrCompiledData = ['数据' =>$数据,'画' =>$this->input->get('draw'),'记录总数' =>$this->model->getRecordsTotal(),'记录过滤' =>$this->model->getRecordsTotal(),];$this->输出->set_content_type('application/json')->set_output(json_encode($arrCompiledData));
请记住,我刚刚写下了这个 - 也许有一些错别字,但您应该能够理解数据表请求的服务器端处理应该如何工作.
I have an user table using DataTables, that will contain more than 200 rows. It's look so fine when I'm using DataTables for default the "pageLength": 10
, and this is the table example.
Username | Type | Request |
user01 1 request01
user02 1 request02
user03 2 request03
user04 1 request04
user05 1 request05
user06 1 request06
user07 1 request07
user08 1 request08
user09 1 request09
user10 1 request10
Showing 1 to 10 of 200 entries
FirstPrevious123...20NextLast
So, for reducing the loading time, I decide to use "processing": true
and "serverSide": true
. Then I got some issue with this "serverSide" : true
, It's print 200 rows of data in table.
Showing 0 to 0 of 0 entries (filtered from NaN total entries)
. Then the pagination is still print and after I click the page 2, it's doing nothing.
I wan't the DataTables is getting the 10 data for the first, after pagination 2 is clicked, it will get 10 more and so on.
I'm using CodeIgniter, here is my code :
On my Views + Js :
<select name="task" id="task">
<option value="1">Task 1</option>
<option value="2">Task 2</option>
</select>
<table id="user-request" class="table">
<thead>
<tr>
<th>Username</th>
<th>Type</th>
<th>Request</th>
</tr>
</thead>
</table>
<script>
... on task change ...
... var task = $("#task").val(); ...
$('#user-request').DataTable({
'processing': true,
'serverSide': true,
'ajax': {
'type': 'POST',
'url': base_url+'user/get_user_request',
'data': {"task":task,"csrf_token":$("input[name=csrf_token]").val()}
}
})
</script>
Note : Task is a different group, example like Class 1 or Class 2, Orchard University or Harvard University
On my Controller :
$task = $this->input->post('task', TRUE);
$user_request = $this->model->all_user_request(task);
foreach ($user_request as $ur)
{
$arr = array();
$arr[] = $ur->username;
$arr[] = $ur->type;
$arr[] = $ur->request;
$data[] = $arr;
}
$output = array(
"data" => $data
);
if (COUNT($output) > 0)
{
echo json_encode($output);
}
On my Model :
public function all_user_request($task_id) {
$query = "SELECT * FROM user_request WHERE task_id = ?";
return $this->db->query($query, $task_id)->result();
}
Note : In model is actually using 2 INNER JOIN
, I'm just simplifying the select only for asking here. (turning into denormalization table only in here).
I was trying to add draw
, recordsTotal
, recordsFiltered
to $output
in my controller just using numeric data. Example
$output = array(
"draw" => 5,
"recordsTotal" => 5,
"recordsFiltered" => 5,
"data" => $data
);
if (COUNT($output) > 0)
{
echo json_encode($output);
}
I was searching for the answer but, and I think the problem is here but I still have no idea where I must get the draw
- recordsTotal
- recordsFiltered
data. I see on another answer from others, they use "draw" => $_POST['draw']
, then I tried it, and it's do nothing.
So I'm trying that using numeric data, but the result is still same. I need some help with this. It's still print 200 rows of data in table.
Showing 0 to 0 of 0 entries (filtered from NaN total entries)
. Then the pagination is still print and after I click the page 2, it's doing nothing.
Datatables send everything you need - if you take a look in your console under network you'll see, that they use the ajax-get method to send those requests to the server
The GET
Parameter are as follows
draw
columns
start
length
search
You can find the entire list here
which means - you've to adapt your model properly...
something like that should work
public function all_user_request($task_id)
{
$intStart = intval($this->input->get("start"));
$intLength = intval($this->input->get("length"));
$strSearch = (strlen($this->input->get("search")["value"]) >= 2) ? $this->input->get("search",true)["value"] : false;
$order = $this->input->get("order",true);
$this->setQuery($task_id,$strSearch);
$query = $this->db->get();
$this->recordsTotal = $query->num_rows();
$this->setQuery($task_id, $strSearch);
if ($intStart >= 0 && $intLength > 0)
{
$this->db->limit($intLength,$intStart);
}
$strOrderField = 'username';
$strDirection = "ASC";
if (is_array($order))
{
switch($order[0]['column'])
{
case 1:
$strOrderField = 'type';
break;
case 2:
$strOrderField = 'request';
break;
}
if (!empty($order[0]['dir'])) $strDirection = $order[0]['dir'];
}
$this->db->order_by($strOrderField,$strDirection);
$query = $this->db->get();
$arrData = $query->result();
return $arrData;
}
public function getRecordsTotal()
{
return $this->recordsTotal;
}
private function setQuery($task_id, $strSearch="")
{
$this->db
->select('*')
->from('user_request')
->where('task_id', $task_id);
if (!empty($strSearch))
{
$this->db->like('task_id', $strSearch);
}
}
and your controller
//controller
$task = $this->input->post('task', TRUE);
$user_request = $this->model->all_user_request($task);
$data = [];
foreach ($user_request as $ur)
{
$data[] = [
$ur->username,
$ur->type,
$ur->request
];
}
$arrCompiledData = [
'data' => $data,
'draw' => $this->input->get('draw'),
'recordsTotal' => $this->model->getRecordsTotal(),
'recordsFiltered' => $this->model->getRecordsTotal(),
];
$this->output
->set_content_type('application/json')
->set_output(json_encode($arrCompiledData));
Please keep in mind i just wrote this down - maybe there are some typos, but you should be able to understand how the serverside processing of a datatables request should work.
这篇关于使用 serverSide 后,带有 Ajax 的 DataTable 无法正常工作:true的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!