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 相关文章推荐
让iframe框架网页在任何浏览器下自动伸缩
Aug 18 Javascript
silverlight线程与基于事件驱动javascript引擎(实现轨迹回放功能)
Aug 09 Javascript
jquery中通过父级查找进行定位示例
Jun 28 Javascript
浅析Javascript使用include/require
Nov 13 Javascript
Javascript验证上传图片大小[前台处理]
Jul 18 Javascript
jQuery实现的省市县三级联动菜单效果完整实例
Aug 01 Javascript
JS 终止执行的实现方法
Nov 24 Javascript
Vue.js仿Metronic高级表格(一)静态设计
Apr 17 Javascript
详解微信小程序中组件通讯
Oct 30 Javascript
详解vue 在移动端体验上的优化解决方案
May 20 Javascript
ant design中upload组件上传大文件,显示进度条进度的实例
Oct 29 Javascript
80行代码写一个Webpack插件并发布到npm
May 24 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中Session的概念
2006/10/09 PHP
php echo 输出字符串函数详解
2010/05/13 PHP
TMDPHP 模板引擎使用教程
2012/03/13 PHP
php数组去重实例及分析
2013/11/26 PHP
PHP SPL标准库之接口(Interface)详解
2015/05/11 PHP
再谈PHP中单双引号的区别详解
2016/06/12 PHP
利用PHP自动生成印有用户信息的名片
2016/08/01 PHP
php+jQuery递归调用POST循环请求示例
2016/10/14 PHP
(function(){})()的用法与优点
2007/03/11 Javascript
基于jQuery选择器的整理集合
2013/04/26 Javascript
巧用js提交表单轻松解决一个页面有多个提交按钮
2013/11/17 Javascript
详解JavaScript正则表达式之分组匹配及反向引用
2016/03/09 Javascript
一步一步封装自己的HtmlHelper组件BootstrapHelper(二)
2016/09/14 Javascript
详解nodejs微信公众号开发——5.素材管理接口
2017/04/11 NodeJs
JavaScript中Hoisting详解 (变量提升与函数声明提升)
2017/08/18 Javascript
写给vue新手们的vue渲染页面教程
2017/09/01 Javascript
Angular搜索场景中使用rxjs的操作符处理思路
2018/05/30 Javascript
JS实现求5的阶乘示例
2019/01/21 Javascript
了解javascript中的Dom操作
2019/05/27 Javascript
微信小程序实现简单文字跑马灯
2020/05/26 Javascript
基于Element封装一个表格组件tableList的使用方法
2020/06/29 Javascript
Python实现压缩与解压gzip大文件的方法
2016/09/18 Python
MAC中PyCharm设置python3解释器
2017/12/15 Python
Python Pillow Image Invert
2019/01/22 Python
python把ipynb文件转换成pdf文件过程详解
2019/07/09 Python
python scipy卷积运算的实现方法
2019/09/16 Python
Python django框架输入汉字,数字,字符生成二维码实现详解
2019/09/24 Python
Python绘制全球疫情变化地图的实例代码
2020/04/20 Python
BIBLOO波兰:捷克的一家在线服装店
2018/03/09 全球购物
PatPat阿根廷:妈妈们的购物平台
2019/05/30 全球购物
电信专业毕业生推荐信
2013/11/18 职场文书
毕业生求职找工作的自我评价范文
2013/11/27 职场文书
创业计划书中要认真思考的问题
2013/12/28 职场文书
2015年团委副书记工作总结
2015/07/23 职场文书
用基于python的appium爬取b站直播消费记录
2021/04/17 Python
Mysql 如何实现多张无关联表查询数据并分页
2021/06/05 MySQL