Grid行编辑插件
//操作列不显示应该就是autoLoad的问题。
Ext.onReady(function () {
Ext.BLANK_IMAGE_URL = "Extjs/resources/themes/images/access/tree/s.gif";
var datas = [
[100, '刘一', 1000, new Date(1990, 05, 07)],
[200, '黄小珠', 2089, new Date(1994, 10, 07)],
[300, '王五', 2900, new Date(1990, 11, 17)]
];
Ext.create('Ext.grid.Panel', {
title: '行编辑插件',
renderTo: Ext.getBody(),
width: 500,
height: 400,
// frame: true,
layout: 'fit',
viewConfig: {
forceFit: true,
//stripRows: true
},
store: {
fields: ['id', 'name', 'salary', 'birthday'],
proxy: {
type: 'memory',
data: datas,
reader: 'array'
},
autoLoad: true
},
plugins: [Ext.create(Ext.grid.plugin.RowEditing, { clicksToEdit: 1 })],//clicksToEdit设置单击鼠标一次开始编辑
columns: [
{ xtype: 'rownumberer', text: '行号', width: 30 },
{ header: 'id', width: 30, dataIndex: 'id', sortable: true },
{
header: '姓名', width: 80, dataIndex: 'name', sortable: true,//默认的就是文本列把,没什么特殊性,就是输入文本
editor: {
xtype: 'textfield',
allowBlank: false
}
},
{
header: '薪水', width: 80, dataIndex: 'salary', sortable: true, format: '0,000',//数字列才有的格式化输出配置
xtype: 'numbercolumn',
editor: {
xtype: 'numberfield',
allowBlank: false
}
},
{
header: '生日', width: 80, dataIndex: 'birthday', sortable: true, xtype: 'datecolumn',
format: 'Y年m月d日',//日期列才有的格式化输出配置
editor: {
xtype: 'datefield',
allowBlank: false
}
}
]
});
});
Grid行编辑插件的更多相关文章
- ligerui grid行编辑示例
<%@ page contentType="text/html; charset=UTF-8" %> <% String path = request.getCo ...
- EXTJS 4.2 资料 控件之Grid 行编辑绑定下拉框,并点一次触发一次事件
主要代码: { header: '属性值', dataIndex: 'PropertyValueName', width: 130, editor: new Ext.form.field.ComboB ...
- EXTJS4.0 grid 可编辑模式 配置
首先配置这个参数 plugins:[//插件 Ext.create("Ext.grid.plugin.CellEditing",{ clicksToEdit:1//单元格 点一下就 ...
- 关于EasyUI DataGrid行编辑时嵌入时间控件
本人做一个名为“安徽中控”项目时,为快速开发基础数据增删改模块,遂采用EasyUIDatagrid将所有增删改查的操作都集中于表格中,并且所有增删改查操作都集中于泛型对象,从而不必为每个表写具体的增删 ...
- JS框架avalon简单例子 行编辑 添加 修改 删除 验证
为什么要写这个例子:做表单的时候,表单包含主子表,对于子表的编辑,使用的是easyui datagrid的行编辑功能,由于业务比较复杂,实现起来比较麻烦,代码写的也很多,因为插件的封装,无法操作原始的 ...
- jqgrid 使用自带的行编辑
上篇jqgrid 单击行启用行编辑,切换行保存原编辑行 本篇,说说使用jqgrid自带的行编辑 1)设置需要编辑的列 editable: true colModel: [ { label: '字段编 ...
- jquery编辑插件tinyMCE的使用方法
jquery编辑插件tinyMCE是一个非常容易集成到您系统的一个html编辑插件,它不像FckEditor那样需要针对专门的后台语言集成,tinyMCE既能做到轻松集成asp.net,php,jav ...
- jqGrid行编辑配置,方法,事件
行编辑可以在行修改后更新数据,如下图所示 用户用鼠标点击选择一行,jqGrid将可编辑的字段转换为数据输入单元,如上面图所示.不可编辑的列,如id,不会转为可输入单元,而是保持不变.可以通过配置col ...
- Kendo UI Grid 批量编辑使用总结
项目中使用Kendo UI Grid控件实现批量编辑,现在将用到的功能总结一下. 批量编辑基本设置 Kendo Grid的设置方法如下: $("#grid").kendoGrid( ...
随机推荐
- 【转】Linux Soclet编程
原文地址:http://www.cnblogs.com/skynet/archive/2010/12/12/1903949.html “一切皆Socket!” 话虽些许夸张,但是事实也是,现在的网络编 ...
- 第五节:什么导致Finalize方法被调用
Finalize方法在垃圾回收结束时被调用,下面有5种事件会导致开始垃圾回收 1.第0代已满 第0代已满,垃圾回收会自动开始.该事件是目前导致Finalize方法被调用的最常见的一种方式,因为虽 ...
- openstack的第二天
今天,在公司测试了还是网络有问题. 但是用了rdo还是成功了~明天就再试试怎么开放端口进来.
- .net 面试问题 汇总
用.net做B/S结构的系统,您是用几层结构来开发,每一层之间的关系以及为什么要这样分层? 答: 从下至上分别为:数据访问层.业务逻辑层(又或成为领域层).表示层 数据访问层:有时候也称为是持久层,其 ...
- ios9网络请求https适配
发现问题:今天升级Xcode 7.0 bata发现网络访问失败.输出错误信息: The resource could not be loaded because the App Transport S ...
- iOS另类的内存管理
iOS的内存管理算是老生常谈的问题了,我们写iOS的时候无时无刻不在涉及到内存管理.从开始的MRR(manual retain-release)到后来ARC(Automatic Reference C ...
- [转]Gridview中实现RadioButton单选效果
HTML <asp:TemplateField ItemStyle-Width="22px"> <ItemTemplate> <asp:RadioBu ...
- APM飞控修改数传模块方法
APM飞控修改数传模块方法 硬件 ARDUCOPTER第二代 数传模块(USB接口) 数传模块(telem接口) usb-ttl模块 修改方法 注意:APM固件版本和数传模块估计版本是分开的,但有一定 ...
- 零基础学习Linux(二)网页乱码问题
上次的博文零基础学习Linux(一)环境搭建中我们已经将Linux环境搭建完毕了,接下来我们就可以进行相关的操作了,在进行操作之前,我们先来看一下大家可能遇到的中文网页乱码问题. 1.问题演示 a)输 ...
- < java.util >-- List接口
List本身是Collection接口的子接口,具备了Collection的所有方法.现在学习List体系特有的共性方法,查阅方法发现List的特有方法都有索引,这是该集合最大的特点. List:有序 ...