Extjs4学习笔记(四)------可编辑表格

最新推荐文章于 2018-04-01 17:34:38 发布

yfcaone

最新推荐文章于 2018-04-01 17:34:38 发布

阅读量814

点赞数

分类专栏： extjs

本文链接：https://blog.csdn.net/yfcaone/article/details/63688376

版权

Extjs4可编辑表格

1.第一种样式
这里写图片描述

这种样式用到的插件是CellEditing.

 var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
            clicksToEdit: 1
        });

默认双击单元格进行编辑, 可以使用clickToEdit此属性更改点击数进行编辑.

在grid中定义插件

plugins: [cellEditing],

此页面的完整代码

     Ext.onReady(function(){
   
        Ext.define('yxrz', {
            extend: 'Ext.data.Model',
            fields:['content','point', 'type']
        });
     //表格行进行编辑
         var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
            clicksToEdit: 1
        });

        var YxrzAddStore=Ext.create('Ext.data.Store',{
            storeId:'YxrzAddStore',
            model: 'yxrz',
            data:[],
            autoLoad: true
        });

        var YxrzAddGrid=Ext.create('Ext.grid.Panel',{
            id:'YxrzAddGrid',
            columnLines:true,
            height:200,
            store: Ext.data.StoreManager.lookup('YxrzAddStore'),
            /*plugins: [rowEditing],*/
            plugins: [cellEditing],
            tbar:[{
                    xtype : "button",
                    text : "添加",
                    iconCls : "Add"