首页 > Web开发 > 详细

雷林鹏分享:jQuery EasyUI 数据网格 - 设置冻结列

时间:2019-04-25 13:45:55      阅读:145      评论:0      收藏:0      [点我收藏+]

  jQuery EasyUI 数据网格 - 设置冻结列

  本实例演示如何冻结一些列,当用户在网格上移动水平滚动条时,冻结列不能滚动到视图的外部。

技术分享图片

  为了冻结列,您需要定义 frozenColumns 属性。frozenColumn 属性和 columns 属性一样。

  $(‘#tt‘).datagrid({

  title:‘Frozen Columns‘,

  iconCls:‘icon-save‘,

  width:500,

  height:250,

  url:‘data/datagrid_data.json‘,

  frozenColumns:[[

  {field:‘itemid‘,title:‘Item ID‘,width:80},

  {field:‘productid‘,title:‘Product ID‘,width:80},

  ]],

  columns:[[

  {field:‘listprice‘,title:‘List Price‘,width:80,align:‘right‘},

  {field:‘unitcost‘,title:‘Unit Cost‘,width:80,align:‘right‘},

  {field:‘attr1‘,title:‘Attribute‘,width:100},

  {field:‘status‘,title:‘Status‘,width:60}

  ]]

  });

  您不需要写任何的 javascript 代码,这样您就能创建一个数据网格(datagrid)组件,如下所示:

  

  url="data/datagrid_data.json"

 

  singleSelect="true" iconCls="icon-save">

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

Item IDProduct ID
List PriceUnit CostAttributeStauts

  下载 jQuery EasyUI 实例

  jeasyui-datagrid-datagrid5.zip

  本文转载自:w3cschool(编辑:雷林鹏 来源:网络 侵删)

雷林鹏分享:jQuery EasyUI 数据网格 - 设置冻结列

原文:https://www.cnblogs.com/pengpeng1208/p/10767855.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!