首先在grid的tbar中定义编辑按钮:
id:'editDataButton',
text:'编辑',
tooltip:'编辑',
iconCls:'edit',
handler: function(){ showeditPanel();}
再定义form:
var xjjlEditForm = new Ext.FormPanel({.......省略form中的定义内容........});
然后定义编辑按钮要调用的函数showeditPanel(同时定义一个加载form的window):
//--编辑按钮调用的函数(弹出编辑窗体)
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
}
这样就可以在新窗口中对选中的数据进行编辑了;
分享到:
相关推荐
首先在grid的tbar中定义编辑按钮:Js代码 代码如下:id:’editDataButton’, text:’编辑’, tooltip:’编辑’, iconCls:’edit’, handler: function(){ showeditPanel();} 再定义form: Js代码 代码如下:var ...
### ExtJs、ASP.net运用Linq ...综上所述,本文档详细介绍了如何在ExtJs与ASP.net相结合的应用中,利用Linq to SQL与SQL存储过程进行高效的数据交互。通过对以上知识点的理解和实践,可以大大提高开发效率和应用性能。
2. **增、删、改操作**:在ExtJS中,增、删、改操作一般通过Form Panel(表单面板)和Record(数据记录)实现。Form Panel提供了丰富的表单元素和验证机制,用户可以输入、编辑数据。当用户提交表单时,这些数据会被...
2. **组件库**:ExtJS 3.0包含了大量的UI组件,如按钮(Button)、表单(Form)、网格(Grid)、树形视图(Tree)和菜单(Menu)。每个组件都有详细的API参考,包括属性、方法、事件和配置项。 3. **数据管理**:...
ExtJS 是一个强大的JavaScript库,专门用于构建富客户端...实际开发中,还需要考虑数据的远程加载(Ajax请求)、错误处理、用户交互优化等问题。通过深入学习ExtJS的API和文档,你可以构建出更加复杂和高效的Web应用。
ExtJs 提供了多种组件用于实现增删改查的交互,如`Ext.form.Panel`用于创建表单,`Ext.grid.Panel`用于显示和编辑表格数据,以及`Ext.toolbar.Toolbar`用于添加操作按钮如“新增”、“编辑”、“删除”。...
在ExtJS 3中,使用`Ext.data.Record`来定义数据模型。定义字段名和类型,这将映射到数据库的列。例如,如果你有一个名为`users`的表,你可能需要定义如下模型: ```javascript var User = new Ext.data.Record....
- 在ExtJs中创建新记录通常涉及创建一个新的表单(`Ext.form.Panel`),包含用于输入数据的字段(`Ext.form.Field`的子类,如`Ext.form.TextField`)。 - 当用户填写完信息后,通过监听表单的提交事件,将数据发送...
在ExtJS 2.2中,开发者可以利用其丰富的UI组件,如表格(Grid)、树形结构(Tree)、表单(Form)、面板(Panel)等,来构建复杂的Web应用。API文档通常会涵盖以下几个主要部分: 1. **基础概念**:讲解ExtJS的核心...
Ext GridPanel 是该框架中的一个重要组件,常用于展示表格数据。本文将详细介绍如何在 Ext GridPanel 中实现加链接操作,包括基本原理、代码实现及注意事项。 #### 一、Ext GridPanel 基础 在了解如何添加链接之前...
- **数据管理**: `Ext.data`是Extjs中用于处理数据的核心模块。 - **连接**: `Ext.data.Connection`和`Ext.data.Ajax`用于发起HTTP请求获取数据。 - **记录模型**: `Ext.data.Record`定义了数据模型的结构。 - **...
在“Ext增删改查”这个主题中,我们将深入探讨如何使用ExtJS进行数据操作,包括添加(Add)、删除(Delete)、修改(Update)和查询(Query)数据。 1. **Ext.data.Model**: 这是ExtJS中的核心类,代表了数据模型。...
- **CreateRecord**: 创建记录,用于向数据存储添加新记录。 - **UpdateRecord**: 更新记录,修改现有数据存储中的记录。 - **GetSelectedRecord**: 获取选中记录,获取当前选中的数据记录。 - **GetForm**: ...
在IT行业中,ExtJS是一个广泛使用的JavaScript库,用于构建富客户端Web应用程序。它提供了一套完整的组件...记得在实际项目中,还需要考虑错误处理、数据验证以及与服务器的交互等方面,以确保应用的健壮性和用户体验。