将easyui-datagrid组件克隆至另一个 easyui-datagrid组件 表结构(列)及数据完全一样

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

将 grid 组件克隆至 grid_toexcel 组件 表结构(列)及数据完全一样

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' >   
        <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");
        
        //将grid中的数据 赋给grid_toexcel
        $('#grid_toexcel').datagrid('loadData',$('#grid').datagrid('getData'));