WB8使用说明-grid增删改查(一)

前端


 

查询:给grid设置store即可完成查询操作,store指定后台写好的select语句即可

注意:column属性,不设置会默认根据数据库查询的情况显示,即属性默认生成,设置columns可以定义表头样式显示文字等

通过设置dataprovider控件的属性,也可以自动生成column列对应的字典名称,详细如下:

 : String

数据字典表名列表,多个表名以“,”分隔。用于使数据源中的字段元数据信息对应到字典表中的同名字段设置的字典信息。 数据库实体表名无须对应到指定的字典表,因为字典信息仅通过字段名称来进行对照和识别,因此相同的字典表可以应用到不同的实体表中。 如果指定多个字典表时存在重复的字段,可以通过设置dictFieldsMap属性来区分。


 

新增: Wb.addEdit(app.grid1);  此时再表格最后一行加一个空行,当然写入另外一个参数数组,就可以直接写入值

解析:addEdit( object, records )//在表格末尾添加新的记录,并对新记录首列开启编辑状态。

更多选项可使用Wb.add方法Wb.add( object, records, [position], [editField], [commit] ) 例如:

var newRecords = Wb.add(app.grid1, [{field: 'foo'}, {field: 'bar'}]);

WB.add 的详细参数如下

Parameters

  • object : Ext.grid.Panel/Ext.view.View/Ext.data.Store
  • 表格或store对象。
  • records : Object[]/Object
  • 添加包含数据的对象或对象列表。
  • position : String (optional)
  • 添加到表格的位置,first首条,last末尾,before当前选择记录之前,after当前选择记录之后,add最后或排序后的位置。 add和last的区别在于表格排序影响add位置。如果当前未选择记录before等同first,after等同last。默认为last。
  • editField : Number (optional)
  • 激活编辑单元格所在的列对象或索引号。如果指定该值在添加记录后自动激活该列单元格。默认不自动激活。
  • commit : Number (optional)
  • 添加后是否自动提交数据。默认为true。

 


 

删除:

Wb.remove(app.grid1);

解析:remove( component, [items], [doSelect] ) 删除表格中的记录、树的节点或指定的控件。如果删除的对象为表格或树,则在删除后将自动选中被删除记录的最近记录。 1component为树,删除树节点;2compnent为表格,删除表格记录;3component为树节点数据,删除数组中的所有节点; 4component为树节点数组,删除数组中的节点;5component为其他数组,删除数组中值为items的元素。

Wb.remove详细参数:

Parameters

  • component : Component
  • 需要删除子项的对象。
  • items : Array (optional)
  • 需要删除的子项条目列表。如果删除对象为表格或树,缺省该值时将删除选中的表格记录或树节点。 如果删除树节点且指定该项值,节点须按深度进行逆向排序(因为删除上级节点后无法删除下级节点),见reverse。
  • doSelect : Boolean (optional)
  • 删除后是否选择下一个节点/记录,默认为true。

保存

Wb.sync({ grid: app.grid1, url: 'm?xwl=examples/crud/crud-db-access/simple-save', message: '正在保存中...', success: function(resp) { app.store.commitChanges(); //如果存在多个store可以设置normalName属性或通过app.grid.store方式找到对象 Wb.toast('已经成功保存数据。'); } });

解析:Wb.sync( configs )把表格或store数据同步到后台。同步操作在一个请求内完成。

Wb.sync详细参数如下:

Parameters

configs : Object

配置参数。

grid : Ext.grid.Panel

需要同步的表格,grid或store任选一个参数。

store : Ext.data.Store

需要同步的Store,grid或store任选一个参数。

configItems : Object...

Wb.request请求时所有参数都可在该方法内使用。


修改:

第一种方式:设置grid的editable:true即可编辑

第二种方式:可以在colum设置editer控件


后端

使用updater控件进行增删改查操作,如果前端严格按照上述前端方式,使用Wb.add(),Wb.addEdit(),Wb.remove(),Wb.sync()方法,并且只是涉及到一个数据表,
就可以在控件updater设置表名称,不需要写任何sql语句
在服务端使用 app.update({ tableName: 'WB_MISC' }); 与使用updater控件效果一样


备注:在客户端使用Wb.syncCreate,可以同步新建记录。该方法首选把返回的数据更新到表格,然后再提交表格新建的数据。
使用 Wb.verifyGrid(app.grid1) 可以验证grid的填写是否正确


posted @ 2017-12-01 12:02  墨媒  阅读(547)  评论(0编辑  收藏  举报