目的 : V120502 Grid的欄位允許編輯
PS: ExtJs 的Grid介紹與常用功能 -
網址 : https://wadehuanglearning.blogspot.com/2017/01/ext.html
處理說明: 1>Ext.Grid 必須透過官方套件才可以編輯內容,可以在 plugins 屬性載入 Ext.grid.plugin.CellEditing 或 Ext.grid.plugin.RowEditing 便可對 Grid 資料進行編輯。
2>columns 中,允許編輯的欄位,加入
{ header: "件號", dataIndex: "PN", width: 150, TMType: "string",editor: 'textfield',},
{ header: "件號", dataIndex: "PN", width: 150, TMType: "string",editor: 'textfield',},
{ header: "數量", dataIndex: "QTY", width: 50, TMType: "string",
editor: { xtype: 'textfield',
allowBlank: false //不允許空白},
},]
1>*.js - grid 欄位允許編輯
//包籤列印 sub_Grid
var sub_Grid = Ext.create('TMGrid', {
grid_id: 'sub_Grid',
columns: sub_Columns,
autoScroll: true,
flex: 1,
store: Ext.create('gridstore', { model: sub_Fields }),
plugins: [
Ext.create('Ext.grid.plugin.RowEditing', { // 加入官方 CellEditing 差件
clicksToEdit: 1 // 按一下進行編輯,預設為按兩下
})
],
});
var sub_Columns = [
{ header: "工號", dataIndex: "SAPNO", width: 150, TMType: "string" },
{ header: "件號", dataIndex: "PN", width: 150, TMType: "string",//editor: 'textfield',},
{
header: "數量", dataIndex: "QTY", width: 50, TMType: "string",
editor: {
xtype: 'textfield',
allowBlank: false //不允許空白
},
},
{ header: "EO", dataIndex: "EOCND", width: 150, TMType: "string" },
{ header: "備註", dataIndex: "RMK", width: 200, TMType: "string", },
]
沒有留言:
張貼留言