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( ...
随机推荐
- STM32F4_RCC系统时钟配置及描述
Ⅰ.概述 对于系统时钟应该都知道它的作用,就是驱动整个芯片工作的心脏,如果没有了它,就等于人没有了心跳. 对于使用开发板学习的朋友来说,RCC系统时钟这一块知识估计没怎么去配置过,原因在于开发板提供的 ...
- TTY驱动程序架构
在Linux系统中,终端是一类字符型设备,它包括多种类型,通常使用tty来简称各种类型的终端设备. • 串口终端(/dev/ttyS*) 串口终端是使用计算机串口连接的终端设备.Linux把每个串行端 ...
- 【Django】Apache上运行多个Django项目
运行单个项目的步骤参考:这里 1 安装环境 操作系统:Ubuntu 12.04 LTS 32 位(安装在VMware虚拟机中) python 版本: Python 2.7.3 Django版本 > ...
- Python脚本控制的WebDriver 常用操作 <三> 浏览器最大化
下面将模拟执行一个控制浏览器最大化的操作 测试用例场景 当我们在测试中使用一些基于图像和坐标的辅助测试工具时,我们就会需要使浏览器在每次测试时保存最大化,以便在同一分辨率下进行图像比对和坐标点选. 举 ...
- 远程连接数据库(通过pgAdmin)
1.编辑/var/lib/pgsql/data/pg_hba.conf,增加语句 host all all 192.168.105.225/36 trust 让数据库接受网络 192.168.105 ...
- spring AOP advice 类型 和 通用的切点的配置方式
spring aop advice的类型: 1.前置通知(before advice) 2.返回后通知(after returning advice) 3.抛出异常后通知(after throwing ...
- .net 高效管理稀缺资源(数据库资源,文件资源等)
MSDN建议按照下面的模式实现IDisposable接口: public class Foo: IDisposable { public void Dispose() { Dispose(true); ...
- MVC 中如何将带有标签的字符串转换为HTML 标签 显示出来?
出现问题的现象:
- 【坑】执行Consumer的时候发生java.net.UnknownHostException错误
[时间]: 2016/4/8 17:30 [问题]: kafka执行Consumer实例的时候,发生了一下错误. kafka配置文件server.properties如下: zookeeper配置文件 ...
- Python实现C4.5(信息增益率)
Python实现C4.5(信息增益率) 运行环境 Pyhton3 treePlotter模块(画图所需,不画图可不必) matplotlib(如果使用上面的模块必须) 计算过程 st=>star ...