526互联

easyui-datagrid中的表结构(列)赋给另一个 easyui-datagrid组件

发布时间 2023-06-14 15:34:41作者: 海乐学习

页面上有两个  easyui-datagrid 组件

grid 用于显示

grid_toexcel 用于导出

目的 将 grid 克隆至 grid_toexcel  使 grid_toexcel 与 grid 的表结构完(列)全一样，但数据并不克隆

html

<table id='grid' class='easyui-datagrid' style='width:1250px;min-height:450px'  
            title='列表' iconCls='icon-table' pagination='true' rownumbers='true' fitColumns='true' singleSelect='true' toolbar='#toolbar' >   
            <!-- rownumbers='true' fitColumns='true' singleSelect='true' toolbar='#toolbar'  remoteSort='false'>   不分页 -->
        <thead>  
            <tr>  
                <th field='agent_name' width='25'align='center' sortable='true' >坐席工号</th> 
                <th field='user_name' width='25'align='center' sortable='true' >坐席员</th> 
 
                <th field='start_time' width='40'align='center' sortable='true' >开始时间</th>
                <th field='stop_time' width='40'align='center' sortable='true' >结束时间</th> 
                <th field='time_len' width='20'align='center' sortable='true' >时长</th> 
                <th field='time_len_s' width='20'align='center' sortable='true' >时长(秒)</th> 
                <th field='status' width='20'align='center' sortable='true' >状态</th>  

                <th field='description' width='80'align='center' sortable='true' >描述</th> 
            </tr>  
        </thead>  
    </table>  
    <div id='div_toexcel' class='easyui-panel' closed='true'><!-- 用于导出 -->
        <table id='grid_toexcel' class='easyui-datagrid'> 
        </table>  
    </div>

js

//var cols = $('#grid').datagrid('getColumnFields'); //获取所有列名
//将grid的表结构(列名)赋给grid_toexcel
var cols=$('#grid').datagrid('options').columns; //获取所有列的json对象
//console.log(cols[0]); 
$('#grid_toexcel').datagrid({columns:[cols[0]]}).datagrid("reload");