雷林鹏分享:jQuery EasyUI 数据网格 - 扩展编辑器

  jQuery EasyUI 数据网格 - 扩展编辑器

  一些常见的编辑器(editor)添加到数据网格(datagrid),以便用户编辑数据。 所有的编辑器(editor)都定义在 $.fn.datagrid.defaults.editors 对象中,这个可以继承扩展以便支持新的编辑器(editor)。 本教程将向您展示如何添加一个新的 numberspinner 编辑器到数据网格(datagrid)。

雷林鹏分享:jQuery EasyUI 数据网格 - 扩展编辑器

  继承扩展 numberspinner 编辑器

  $.extend($.fn.datagrid.defaults.editors, {

  numberspinner: {

  init: function(container, options){

  var input = $('').appendTo(container);

  return input.numberspinner(options);

  },

  destroy: function(target){

  $(target).numberspinner('destroy');

  },

  getValue: function(target){

  return $(target).numberspinner('getValue');

  },

  setValue: function(target, value){

  $(target).numberspinner('setValue',value);

  },

  resize: function(target, width){

  $(target).numberspinner('resize',width);

  }

  }

  });

  在 html 标记中创建数据网格(DataGrid)

  

  url="data/datagrid_data.json" title="Editable DataGrid" iconCls="icon-edit"

  singleSelect="true" idField="itemid" fitColumns="true">

  

  

  

  

  

  

  

  

  

  

  

Item ID List Price Unit Cost Attribute Status Action

  我们分配 numberspinner 编辑器到 'unit cost' 字段。 当开始编辑一行,用户可以通过 numberspinner 编辑器来编辑数据。

  下载 jQuery EasyUI 实例

  jeasyui-datagrid-datagrid23.zip

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

上一篇:Prometheus —— Go 语言开发的服务监控系统


下一篇:Linux硬链接和软链接