公司最近要做一个web项目,为了快速开发,决定使用ext.net来开发。在之前的一年多时间里全是做的一些桌面开发,asp.net方面的很多东西都忘记了,特别是javascript相关的东西,很久没有用了。于是前几天抓紧时间熟悉ext.net ,下载了相关的源码和案例自学。看了一下觉得基本懂了,于是试着搞搞结果自己一动手才知道问题多多。首先是ext.net 的mvc实现业务数据层的处理都是采用url配置路由来是实现的,这个功能我也是看了半天。
言归正传说说今天晚上的主题:如何把一个GridPanel中选中的某行数据,传递到一个弹出Window的FromPanel中去,并实现数据和控件的自动绑定呢?
有人说可以传递该行数据的主键ID,让后从数据库等数据源中去读取,这里我认为这是很“费劲的”处理方式,不仅加大了数据库等数据源的访问量,效率也会更底。因为这些数据基本上已经是从数据库取得了的,何必再次问人家获取一次呢!经过研究可以通过使用FormPanel的form.loadRecord(data)来实现。
直接上代码:比如Gridpanel最后有一列编辑列。
GridPanel Edit Column
1 <ext:CommandColumn Width="25" Hideable="false"> 2 <Commands> 3 <ext:GridCommand CommandName="Edit" Icon="ApplicationFormEdit"> 4 <ToolTip Text="编 辑" /> 5 </ext:GridCommand> 6 </Commands> 7 <PrepareToolbar Handler="toolbar.setVisible(!record.newRecord);" /> 8 </ext:CommandColumn> 9 <ext:CommandColumn Width="25" Hideable="false"> 10 <Commands> 11 <ext:GridCommand CommandName="Delete" Icon="Cross"> 12 <ToolTip Text="删 除" /> 13 </ext:GridCommand> 14 </Commands> 15 <PrepareToolbar Handler="toolbar.setVisible(!record.newRecord);" /> 16 </ext:CommandColumn> 17 </Columns> 18 </ColumnModel> 19 <SelectionModel> 20 <ext:RowSelectionModel runat="server" SingleSelect="true" /> 21 </SelectionModel> 22 <LoadMask ShowMask="true" /> 23 <Listeners> 24 <Command Fn="commandHandler" /> 25 </Listeners> 26 </ext:GridPanel>
commandHandler
1 var commandHandler = function (cmd, record) { 2 switch (cmd) { 3 case "Edit": 4 var win = OrgInfoWin; 5 var effDate = record.data.EffDate; 6 if (effDate != null && typeof (effDate) == "string") { 7 effDate = effDate.toString(); 8 record.data.EffDate = eval("new " + effDate.substr(1, effDate.length - 2)); 9 } 10 var expDate = record.data.ExpDate; 11 if (expDate != null && typeof (expDate) == "string") { 12 expDate = expDate.toString(); 13 record.data.ExpDate = eval("new " + expDate.substr(1, expDate.length - 2)); 14 } 15 orgPanel.form.loadRecord(record); 16 win.setTitle(record.data.OrgName); 17 win.show(); 18 break; 19 case "Delete": 20 Ext.Msg.confirm('Alert', 'Delete Record?', function (btn) { 21 if (btn == "yes") { 22 dsCustomers.remove(record); 23 dsCustomers.save(); 24 } 25 }); 26 break; 27 } 28 };
commandHandler 中的orgPanel就是对应的FormPanel。重点是FormPanel中的<ext:TextField>等控件的Id名称必须和data中的数据的名称对应,并且数据类型也应该一致,这样才能绑定上,夜已深了,潦草的写一下,还望见谅!
2012-06-18 23:51:57