
呆错后台管理框架表格排序开发实例
人气:629 更新:2022-07-07
在2.1版本前,呆错的JS基础包集成了sorttable这个拖拽排序,在2.1.9版本时增加了按箭头上下操作排序的方式,具体实现方法如下
第一步:定义表格的列属性,即下方的($columns),data-formatter定义的回调JS函数为生成的箭头图标样式,实例如下:
'term_order' => [
'order' => 1,
'type' => 'number',
'value' => intval($data['term_order']),
'data-filter' => false,
'data-visible' => true,
'data-width' => 80,
'data-sortable' => true,
'data-sort-name' => 'op_order',
'data-order' => 'asc',
'data-formatter' => 'daicuo.admin.table.sortFormatter',
],
第二步:定义后端排序固定入口(sort),如admin/controll/menu的sort实例
public function sort()
{
$id = input('get.id/d',0);
if(input('type') == 'up'){
$result = dbUpdateInc('common/Op', ['op_id'=>['eq',$id]], 'op_order', 1);
}else{
$result = dbUpdateDec('common/Op', ['op_id'=>['eq',$id]], 'op_order', 1);
}
if($result){
$this->success(lang('success'));
}else{
$this->error(lang('fail'));
}
}
第三步:展示数据默认请按权重值的倒序展示(值越大越靠前),即用DcBuildTable函数生成表格时传递的排序字段与排序方式。
{:DcBuildTable([
'data-name' => 'admin/menu/index',
'data-escape' => false,
'data-toggle' => 'bootstrap-table',
'data-url' => DcUrl('admin/menu/index', $query),
'data-unique-id' => 'term_id',
'data-id-field' => 'term_id',
'data-select-item-name' => 'id[]',
'data-query-params-type' => 'params',
'data-query-params' => 'daicuo.table.query',
'data-sort-name' => 'term_order',
'data-sort-order' => 'desc',
'data-pagination' => false,
'columns' => $columns,
])}