extjs中form与grid交互数据(record)的方法


Posted in Javascript onAugust 29, 2013

首先在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 
}

这样就可以在新窗口中对选中的数据进行编辑了;
Javascript 相关文章推荐
jquery下利用jsonp跨域访问实现方法
Jul 29 Javascript
jQuery选择器简明总结(含用法实例,一目了然)
Apr 25 Javascript
深入理解JavaScript系列(47):对象创建模式(上篇)
Mar 04 Javascript
解决bootstrap中modal遇到Esc键无法关闭页面
Mar 09 Javascript
js 实现数值的千分位及保存小数方法(推荐)
Aug 01 Javascript
Bootstrap实现带动画过渡的弹出框
Aug 09 Javascript
详解AngularJS ui-sref的简单使用
Apr 24 Javascript
将input框中输入内容显示在相应的div中【三种方法可选】
May 08 Javascript
轻松玩转BootstrapTable(后端使用SpringMVC+Hibernate)
Sep 06 Javascript
通过一次报错详细谈谈Point事件
May 17 Javascript
vue里面使用mui的弹出日期选择插件实例
Sep 16 Javascript
element-ui如何防止重复提交的方法步骤
Dec 09 Javascript
JS中图片缓冲loading技术的实例代码
Aug 29 #Javascript
js中substring和substr的详细介绍与用法
Aug 29 #Javascript
由点击页面其它地方隐藏div所想到的jQuery的delegate
Aug 29 #Javascript
JavaScript自定义事件介绍
Aug 29 #Javascript
JavaScript包装对象使用介绍
Aug 29 #Javascript
JavaScript作用域链使用介绍
Aug 29 #Javascript
JavaScript 命名空间 使用介绍
Aug 29 #Javascript
You might like
一个php作的文本留言本的例子(六)
2006/10/09 PHP
认识并使用PHP超级全局变量
2010/01/26 PHP
php中调用其他系统http接口的方法说明
2014/02/28 PHP
浅析get与post的一些特殊情况
2014/07/28 PHP
PHP 用session与gd库实现简单验证码生成与验证的类方法
2016/11/15 PHP
如何解决PHP获取不到SESSION信息之一般情况
2019/10/10 PHP
javascript void(0)的妙用
2009/10/21 Javascript
一步一步制作jquery插件Tabs实现过程
2010/07/06 Javascript
jquery异步请求实例代码
2011/06/21 Javascript
JS实现切换标签页效果实例代码
2013/11/01 Javascript
javascript正则表达式之search()用法实例
2015/01/19 Javascript
微信小程序 增、删、改、查操作实例详解
2017/01/13 Javascript
详解数组Array.sort()排序的方法
2020/05/09 Javascript
修改UA在PC中访问只能在微信中打开的链接方法
2017/11/27 Javascript
nodejs实现简单的gulp打包
2017/12/21 NodeJs
vue实现底部菜单功能
2018/07/24 Javascript
iview的table组件自带的过滤器实现
2019/07/12 Javascript
[01:07:19]2018DOTA2亚洲邀请赛 4.5 淘汰赛 Mineski vs VG 第一场
2018/04/06 DOTA
python创建线程示例
2014/05/06 Python
python监控键盘输入实例代码
2018/02/09 Python
python通过伪装头部数据抵抗反爬虫的实例
2018/05/07 Python
Python爬取数据并写入MySQL数据库的实例
2018/06/21 Python
用python3教你任意Html主内容提取功能
2018/11/05 Python
python中退出多层循环的方法
2018/11/27 Python
Numpy与Pytorch 矩阵操作方式
2019/12/27 Python
Keras实现支持masking的Flatten层代码
2020/06/16 Python
Jupyter安装链接aconda实现过程图解
2020/11/02 Python
Python爬虫之Selenium实现窗口截图
2020/12/04 Python
Oral-B荷兰:牙医最推荐的品牌
2020/02/25 全球购物
what is the difference between ext2 and ext3
2013/11/03 面试题
《中国的气候》教学反思
2014/02/23 职场文书
新闻编辑求职信
2014/04/09 职场文书
保护动物倡议书
2014/04/15 职场文书
财务内勤岗位职责
2014/04/17 职场文书
超市优秀员工事迹材料
2014/05/01 职场文书
spring boot项目application.properties文件存放及使用介绍
2021/06/30 Java/Android