zoukankan      html  css  js  c++  java
  • EasyUI datagrid自适应问题解决

    在使用js 动态创建EasyUI datagrid时,如果设置fit为true,在显示的时候数据的高度为固定高度不能自适应

    解决办法是把fit设为false。

    但这样设置后又有个问题,如果把columns定义在js里面,及时宽度设置为百分百,单元格的宽度不能随着浏览器的大小而变化

    解决办法是把columns定义在页面html里。

    最后的代码如下:

    html代码

     1 <table id="grid" title="考勤数据" style="100%;height:auto">
     2       <thead>
     3            <tr>
     4                <th field="GUID" hidden="hidden">ID</th>
     5                <th field="EmpName" width="20%">姓名</th>
     6                <th field="KqDate" width="20%">日期</th>
     7                <th field="KqTime" width="20%">时间</th>
     8                <th field="IsInvalid" width="16%">是否有效</th>
     9                <th field="Remark" width="20%">备注</th>
    10            </tr>
    11       </thead>
    12 </table>

    js代码

     1  $('#grid').datagrid({
     2         url: '/Checking/GetAll?r=' + Math.random(), //数据接收URL地址
     3         iconCls: 'icon-view', //图标
     4         fit: false, //自动适屏功能
     5         nowrap: true,
     6         autoRowHeight: false, //自动行高
     7         autoRowWidth: true,
     8         striped: true,
     9         collapsible: false,
    10         remoteSort: true,
    11         idField: 'GUID', //主键值
    12         pagination: true, //启用分页
    13         rownumbers: true, //显示行号
    14         multiSort: true, //启用排序
    15         sortable: true, //启用排序列
    16         fitcolumns: true,
    17         queryParams: $("#searchform").form2json(), //搜索条件查询
    18         singleSelect: true,
    19         /*columns: [[
    20             { field: 'GUID', hidden: true },
    21             { field: 'EmpName', title: '姓名',  '20%', sortable: true },
    22             { field: 'KqDate', title: '日期',  '20%', sortable: true },
    23             { field: 'KqTime', title: '时间',  '20%', sortable: true },
    24             { field: 'IsInvalid', title: '有效否',  '16%', sortable: true },
    25             { field: 'Remark', title: '备注',  '20%' }
    26         ]],*/
    27         toolbar: '#divtoolbar'
    28     });
    29 }
  • 相关阅读:
    C++类构造函数初始化列表
    VC++检测硬件设备状态
    MFC中调用Windows API函数的方式
    DEBUG无法进入断点解决方法
    【转】c++数组初始化
    vc++实现控制USB设备启用与否
    3d图像坐标轴及css3属性的讲解
    Ajax的兼容及Ajax的缓存问题
    Ajax中最有名axios插件(只应用于Ajax)(post方法,官网写错了,应是字符串格式)
    文档碎片及xml讲解
  • 原文地址:https://www.cnblogs.com/Jeffiy/p/3965728.html
Copyright © 2011-2022 走看看