zoukankan      html  css  js  c++  java
  • ext4.1 editgrid的增删改

    
        Ext.define('model', {
            extend: 'Ext.data.Model',
            fields: [
            //第一个字段需要指定mapping,其他字段,可以省略掉。其实好像不用也可以
            {
            name: 'iden',
            mapping: 'iden'
    }, 'fdno', 'shangpbm', 'shangpmc', 'guigxh', 'danw', 'shul', 'danj', 'jinge', 'beiz']
        });
    
        //创建数据源
        var store = Ext.create('Ext.data.Store', {
            model: 'model',
            proxy: {
                //异步获取数据,这里的URL可以改为任何动态页面,只要返回JSON数据即可
                type: 'ajax',
                url: 'BLL/H_suipkjBLL.aspx?action=list',
                reader: {
                    type: 'json',
                    root: 'items' //没有root我的json死活出不来
                    //totalProperty  : 'total'
                }
            },
            listeners: {
                update: function (store, record) {
                    var currPage = store.currentPage;
                    var jsondate = record.get("iden") + "|" + record.get("fdno") + "|" + record.get("shangpbm") + "|"
                    + record.get("danw") + "|" + record.get("shul") + "|" + record.get("danj")
                    + "|" + record.get("beiz");
                    //还不是很会用json传输,暂时凑合下
                    Ext.Ajax.request({
                        url: 'BLL/H_suipkjBLL.aspx?action=update',
                        params: { parajson: jsondate },
                        success: function (response) {
                            //store.removeAll();
                            store.load();
                        }
                    });
                },
                remove: function (store, record) {
                    var currPage = store.currentPage;
                    //alert(record.get("ID"))
                    Ext.Ajax.request({
                        url: 'BLL/H_suipkjBLL.aspx?action=delete',
                        params: {
                            iden: record.get("iden")
                        },
                        success: function (response) {
                            //store.removeAll();
                            store.load();
                        }
                    });
                }
            },
            autoLoad: true
            //autoSync : true
        });
        //创建Grid
        Ext.define('grid', {
            extend: 'Ext.grid.Panel',
            alias: 'widget.writergrid',
            store: store,
            requires: ['Ext.grid.plugin.CellEditing', 'Ext.form.field.Text', 'Ext.toolbar.TextItem'],
    
            initComponent: function () {
    
                this.editing = Ext.create('Ext.grid.plugin.CellEditing');
    
                Ext.apply(this, {
                    iconCls: 'icon-grid',
                    frame: true,
                    plugins: [this.editing],
                    dockedItems: [{
                        xtype: 'toolbar',
                        items: [{
                            icon: 'Scripts/img/add.gif',
                            text: '加行',
                            scope: this,
                            handler: this.onAddClick
                        }, {
                            icon: 'Scripts/img/delete.gif',
                            text: '减行',
                            disabled: true,
                            itemId: 'delete',
                            scope: this,
                            handler: this.onDeleteClick
                        }]
                    }],
                    columns: [{
                        text: '编号',
                         40,
                        sortable: true,
                        dataIndex: 'iden'
                    }, {
                        header: 'fdno',
                         80,
                        sortable: true,
                        dataIndex: 'fdno'
                    }, {
                        header: '商品编号',
                         80,
                        sortable: true,
                        dataIndex: 'shangpbm',
                        field: {
                            type: 'textfield'
                        }
                    }, {
                        header: '商品名称',
                        //flex: 2,
                         280,
                        sortable: true,
                        dataIndex: 'shangpmc'
                    }, {
                        header: '规格',
                         80,
                        sortable: true,
                        dataIndex: 'guigxh'
                    }, {
                        header: '单位',
                         40,
                        sortable: true,
                        dataIndex: 'danw',
                        field: {
                            type: 'textfield'
                        }
                    },
                        {
                            header: '数量',
                             40,
                            sortable: true,
                            dataIndex: 'shul',
                            field: {
                                xtype: 'numberfield',
                                allowBlank: false,
                                minValue: 0,
                                maxValue: 100000
                            }
                        },
                        {
                            header: '单价',
                             80,
                            sortable: true,
                            dataIndex: 'danj',
                            field: {
                                xtype: 'numberfield',
                                allowBlank: false,
                                minValue: 0,
                                maxValue: 100000
                            }
                        }, {
                            header: '金额',
                             100,
                            sortable: true,
                            dataIndex: 'jinge'
                        }, {
                            header: '备注',
                             100,
                            sortable: true,
                            dataIndex: 'beiz',
                            field: {
                                type: 'textfield'
                            }
                        }]
                });
                this.callParent();
                this.getSelectionModel().on('selectionchange', this.onSelectChange, this);
                //this.on('edit', this.onEdit, this);
            },
            onSelectChange: function (selModel, selections) {
                this.down('#delete').setDisabled(selections.length === 0);
            },
            //        onEdit: function () {
            //            var record = this.getSelectionModel().getSelection()[0];
            //            var shangpbm = record.get('shangpbm');
            //            var shul = record.get('shul');
            //            var danj = record.get('danj');
            //                Ext.Ajax.request
            //                ({
            //                   params: { parashangpbm: shangpbm }, //发送的参数
            //                   url: "BLL/H_suipkjBLL.aspx?action=gridlink", //请求的地址
            //                   success: function (response, option) {
            //                       var rlnoteinfo = response.responseText;
            //                       var aryinfo = new Array();
            //                       aryinfo = rlnoteinfo.split("|");
            ////                     record.set('shangpmc', aryinfo[0]);
            ////                     record.set('guigxh', aryinfo[1]);
            //                        }
            //                 });
            //            }
            //alert(colname);
            //        onSync : function() {//同步到store
            //            this.store.sync();
            //        },
            onDeleteClick: function () {
                var selection = this.getView().getSelectionModel().getSelection()[0];
                if (selection) {
                    this.store.remove(selection);
                }
            },
            onAddClick: function () {
                var rec = new model({
                    iden: '',
                    fdno: '',
                    shangpbm: '',
                    shangpmc: '',
                    guigxh: '',
                    danw: '',
                    shul: '',
                    danj: '',
                    jinge: '',
                    beiz: ''
                }),
                edit = this.editing;
                edit.cancelEdit();
                this.store.insert(0, rec);
                edit.startEditByPosition({
                    row: 0,
                    column: 1
                });
            }
        });


    /* 改变表格偶数行的背景颜色 */
    .x-grid3-row-alt{background-color:#fff0d0;}

     
                update: function (store, record) {
                    var currPage = store.currentPage;
                    var cg = record.getChanges();//获取修改过的行
    //如果shangpbm修改过就有值,否则是undefined
                    if (cg.shangpbm == undefined )
                        return;
    
    }
    

      

  • 相关阅读:
    让delphi2010能有delphi7的版面布局
    多线程的基本概念和Delphi线程对象Tthread介绍
    Delphi编写后台监控软件
    delphi 2010是动画GIF的支持方法
    delphi 资源文件详解
    delphi 基础之四 delphi 组织结构
    delphi 基础之三 编写和调用dll文件
    delphi 基础之三 文件流操作
    mysql (5.7版本)---的配置
    session--保持登录20分钟,常用与用户登录状态
  • 原文地址:https://www.cnblogs.com/shadowtale/p/2580108.html
Copyright © 2011-2022 走看看