easyui datagrid 怎样默认为全选数据

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easyui datagrid 怎样默认为全选数据相关的知识,希望对你有一定的参考价值。

貌似没有全选的属性,只能使用方法了,$('#dg').datagrid('selectAll');


demo

            $(target).datagrid(
                //定义可折叠的详细试图
                //view : detailview,
                //数据源
                url : '../servlet/GetQrcodes',
                //只能选择一列
                singleSelect : true,
                //排序的列
                //sortName : 'nickname',
                //排序的方式
                //sortOrder : 'desc',
                //显示行号
                rownumbers : true,
                //添加底部分页工具栏
                pagination : true,
                //最好放到这里,如果放到pagination里,数据加载会显示默认的10条,pageNumber为空等异常
                pageList : [ 10, 50, 100 ],
                pageNumber : 1,
                //自适应列
                fitColumns : true,
                //每行的格式
                detailFormatter : function(index, row) 
                    return '<div class="ddv" style="padding:5px 0"></div>';
                ,
                toolbar : [ 
                    text : '添加',
                    iconCls : 'icon-add',
                    handler : function() 
                        addQrcode(target);
                    
                , '-', 
                    text : '编辑',
                    iconCls : 'icon-edit',
                    handler : function() 
                        editQrcode(target);
                    
                 ],
                //表头
                columns : [ [ 
                    field : 'scene_id',
                    title : '场景ID',
                    width : 10
                , 
                    field : 'scene_name',
                    title : '场景名称',
                    sortable : true,
                    width : 20
                , 
                    field : 'ticket',
                    title : 'ticket',
                    width : 60
                 ] ]
            );

            $(target).datagrid(
                //onClickRow/onDblClickRow
                onDblClickRow : function(rowIndex, rowData) 
                    var img = rowData.ticket;
                    imgBox(img);
                

            );

            //这条语句必须放到最后,不然没有效果
            $(target).datagrid('getPager').pagination(
                //在这里加载页数列表,如果放到datagrid里,rows=NAN,加载数据出错
                displayMsg : '显示 from 到 to, 共 total 项',
                beforePageText : '第',
                afterPageText : '页,共 pages页'
            );

参考技术A

当数据载入完成时调用selectAll方法即可。

举例:

onLoadSuccess:function()
$('#test').datagrid('selectAll');

放在如下所在地方:

$(function()
$('#test').datagrid(
title:'My DataGrid',
iconCls:'icon-save',
width:700,
height:350,
nowrap: true,
autoRowHeight: false,
striped: true,
collapsible:true,
url:'datagrid_data.json',
sortName: 'code',
sortOrder: 'desc',
remoteSort: false,
idField:'code',
frozenColumns:[[
                field:'ck',checkbox:true,
                title:'Code',field:'code',width:80,sortable:true
]],
columns:[[
        title:'Base Information',colspan:3,
field:'opt',title:'Operation',width:100,align:'center', rowspan:2,
formatter:function(value,rec)
return '<span style="color:red">Edit Delete</span>';


],[
field:'name',title:'Name',width:120,
field:'addr',title:'Address',width:220,rowspan:2,sortable:true,
sorter:function(a,b)
return (a>b?1:-1);

,
field:'col4',title:'Col41',width:150,rowspan:2
]],
pagination:true,
rownumbers:true,
toolbar:[
id:'btnadd',
text:'Add',
iconCls:'icon-add',
handler:function()
$('#btnsave').linkbutton('enable');
alert('add')

,
id:'btncut',
text:'Cut',
iconCls:'icon-cut',
handler:function()
$('#btnsave').linkbutton('enable');
alert('cut')

,'-',
id:'btnsave',
text:'Save',
disabled:true,
iconCls:'icon-save',
handler:function()
$('#btnsave').linkbutton('disable');
alert('save')

],
onLoadSuccess:function()
$('#test').datagrid('selectAll');

);
var p = $('#test').datagrid('getPager');
$(p).pagination(
onBeforeRefresh:function()
alert('before refresh');

);
);

参考链接:

http://www.jeasyui.com/documentation/index.php

http://www.zi-han.net/case/easyui/datagrid&tree.html#datagrid

本回答被提问者采纳

以上是关于easyui datagrid 怎样默认为全选数据的主要内容,如果未能解决你的问题,请参考以下文章

怎样用JS实现CHECKBOX 为全选

使用Easyui ,表格表头的复选框怎么实现全选和取消全选的功能,

使用Easyui ,表格表头的复选框怎么实现全选和取消全选的功能,

求助Easyui datagrid 的默认选中问题

easyUI中的treegrid如何支持大数据量的展示,不分页。像它的datagrid一样

EasyUI datagrid 如何默认选择多行