extjs中form与grid交互数据(record)的方法
更新时间：2013年08月29日 16:03:07 作者：
这篇文章介绍了extjs中form与grid交互数据(record)的方法，有需要的朋友可以参考一下
首先在grid的tbar中定义编辑按钮：
Js代码
复制代码 代码如下:
id:'editDataButton',
text:'编辑',
tooltip:'编辑',
iconCls:'edit',
handler: function(){ showeditPanel();}
再定义form：
Js代码
复制代码 代码如下:
var xjjlEditForm = new Ext.FormPanel({.......省略form中的定义内容........});
然后定义编辑按钮要调用的函数showeditPanel(同时定义一个加载form的window)：
Js代码
复制代码 代码如下:
//--编辑按钮调用的函数（弹出编辑窗体）
function showeditPanel()
{ //直接取得选中的行对应的record
var record = grid.getSelectionModel().getSelected()
if(!record){
Ext.Msg.alert('信息','请选择要编辑的数据');
return;
}
//--定义编辑窗体
if(!xjjlEditWindow)
{
xjjlEditWindow = new Ext.Window({
el: 'edit_win', //前端放置当前js文件的页面中的div名称
title:'编辑记录',
width: 650,
height: 360,
closable: false,
closeAction: 'hide',
resizable: false,
items: xjjlEditForm //在window中加载编辑的form
});
}
xjjlEditWindow.show(Ext.get('editDataButton'));//显示编辑窗口
//[注意]先xjjlEditWindow.show(); 再 xjjlEditForm.getForm().loadRecord(currrecordRecord); 就可以解决之前的页面加载完成以后,第一次点击[编辑]按钮时无法加载数据到form的问题了。
xjjlEditForm.getForm().loadRecord(record);
//关键是这里用当前选中的grid中的record填充form
}
这样就可以在新窗口中对选中的数据进行编辑了;
相关文章
这篇文章主要介绍了JS闭包用法,结合具体实例形式分析了javascript闭包的原理、执行步骤与相关操作技巧,需要的朋友可以参考下2017-03-03
本文将介绍一款Leaflet的经纬网插件,基于这款经纬网插件,详细介绍如何实现经纬网功能,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧2023-12-12
下面对实现页面定时跳转（也称倒计时跳转）做一下总结，以备不时之需，经常使用的朋友可以参考下2013-10-10
这篇文章主要为大家详细介绍了js原生Ajax的封装和原理，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-03-03
最近接了个项目，要开发一个地方的O2O租书项目，使用的是asp.net mvc技术，其中咋图书详情页，用户可以输入借阅的数量，器实现此功能的方法是使用了js来控制数量的增减和校验，对js实现商品数量的增减功能感兴趣的朋友一起学习吧2016-01-01
动态生成的IFRAME，设置SRC时的，不同位置带来的影响。 以下所说的是在IE7下运行的。IE6下也是同样。 在这个blog中，直接点击运行代码，和把下面代码保存到为网页在运行（以本地文件或域名访问），效果不一样。2008-03-03
在一些程序开发中，对于删除操作，最好再让用户确认一下，以免误操作，带来的损失，下面的方法，大家可以参考下。各个语言下，都通用的思路。2010-07-07
这篇文章主要介绍了js中iframe调用父页面的方法,可通过window.parent.方法()来实现,非常具有实用价值,需要的朋友可以参考下2014-10-10
这篇文章主要介绍了javascript实现10个球随机运动、碰撞的方法,实例分析了javascript实现小球碰撞的原理与实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-07-07
javascript数组组合成字符串的脚本...2007-11-11
最新评论