`

EXT的GridPanel与FormPanel交互

EXT 
阅读更多
联系了下gridpanel 与 formpanel  ,以备以后查看
Ext.onReady(function(){
  var _grid = new Ext.grid.GridPanel({
  id:'viewGrid',
  title:'GridPanel',
  renderTo:Ext.getBody(),
  width:320,
  height:200,
  colModel:new Ext.grid.ColumnModel([{
  header:'姓名'
  },{
  header:'性别'
  },{
  header:'年龄'
  }]),
  store:new Ext.data.JsonStore({
  autoLoad:true,
  url:'<%=path%>/store/Data.jsp',
  fields:['name','sex','age']
  }),
  selModel:new Ext.grid.RowSelectionModel({
  singleSelect:true,
  listeners:{
  'rowselect':function(){
  var _r = Ext.getCmp('viewGrid').getSelectionModel().getSelected();
 
  Ext.getCmp('viewForm').getForm().loadRecord(_r);
  }
  }
  })
  });
 
  var _form = new Ext.form.FormPanel({
  id:'viewForm',
  frame:true,
  renderTo:Ext.getBody(),
  autoShow:true,
  defaultType:'textfield',
  width:320,
  labelWidth:50,
  defaults:{width:200},
  items: [{
  fieldLabel:'姓名',
  name:'name'
  },{
  fieldLabel:'性别',
  name:'sex'
  },{
  fieldLabel:'年龄',
  name:'age'
  }],
  buttons:[{
  text:'修改',
  handler:function(){
if(Ext.getCmp('viewGrid').getSelectionModel().getCount == 0)return;

var _r = Ext.getCmp('viewGrid').getSelectionModel().getSelected();

var _formValues = Ext.getCmp('viewForm').getForm().getValues();

_r.set('name',_formValues['name']);

_r.set('sex',_formValues['sex']);

_r.set('age',_formValues['age']);

_r.commit();
  }
  }]
 
  });
  });
  • 大小: 5.4 KB
0
0
分享到:
评论

相关推荐

    Ext与后台数据库交互

    ### Ext与后台数据库交互知识点详解 #### 一、Ext中常用的类 在Ext框架中,为了更好地处理数据和用户界面的交互,引入了一系列强大的类来简化开发过程。 ##### 1.1 Ext.data `Ext.data`是Ext框架的核心模块之一...

    ext form gridpanel

    在Ext JS中,创建一个Form GridPanel涉及到多个步骤,包括定义模型(Model)、店铺(Store)、网格面板(GridPanel)和表单(FormPanel)。`makeForm.js`可能包含了这些元素的配置代码,以及如何将它们组合在一起以...

    ext.net 1.x DEMO

    在EXT.NET中,你可以使用 TreePanel 或者 GridPanel 来展示事务,通过 Store 与服务器端进行数据交互。同时,可能还会有 Form 组件用于添加和编辑事务详情。TransManage 可能还包括了一些自定义的事件处理和业务逻辑...

    EXT和JAVA例子

    EXT JS提供了丰富的UI组件,如GridPanel(表格),FormPanel(表单),Window(弹出窗口),TabPanel(选项卡)等,这些都是构建用户界面的基础。开发者可以通过配置对象定义组件的属性,如大小、颜色、样式等,并...

    Ext教程表单表格的使用

    总结来说,EXT表单FormPanel和表格GridPanel是EXT JS中构建动态Web应用的关键组件,它们提供了丰富的功能和灵活的配置,可以实现复杂的用户界面和数据管理。通过理解并熟练运用这两个组件,开发者能够构建出交互性强...

    examples.ext.net-5.zip

    EXT.NET 5.2版本是该框架的一个重要里程碑,尤其对于WebForm开发者而言,其功能和性能的提升使得构建交互式和响应式的Web应用变得更加便捷。本篇文章将围绕"examples.ext.net-5.zip"这个压缩包中的实例代码进行深入...

    Ext面向对象开发实践代码第1/2页

    1. **继承与扩展**:`PersonListGridPanel` 类继承自 `Ext.grid.GridPanel`,增加了自己的特性。 2. **组件组合**:使用了GridPanel、FormPanel和Window组件,组合成一个完整的应用。 3. **事件处理**:通过添加事件...

    ext TreeFilter ext 写的快速检索

    在实际应用中,EXT TreeFilter通常与其他EXT JS组件结合使用,如GridPanel、FormPanel等。例如,用户可以在FormPanel中输入检索条件,然后将结果显示在一个配置了TreeFilter的EXT Tree中。这样的设计为用户提供了...

    EXT4 自己整理的一些常用方法

    EXT4的GridPanel提供了丰富的API,可以定制各种复杂的数据展示和交互需求。 2. **Function**: 这个部分可能包含EXT4中各种函数的实现,比如数据处理函数、事件处理函数、表单验证函数等。EXT4支持面向对象的编程...

    ext3.0中文API

    EXT3.0的FormPanel提供了多种表单元素,如文本字段、下拉列表、复选框和单选按钮等,以及表单验证和数据提交功能。API文档将指导开发者如何创建动态表单,处理用户输入,并与服务器进行数据交互。 Charts是EXT3.0中...

    ExtJs中处理后台传过来的date对象显示到页面上

    在ExtJs中处理后台传递的Date对象并将其正确地显示在页面上,通常...这种方法避免了在后台将Date对象转换为字符串,提高了前后端交互的效率和灵活性。同时,由于使用了专门的日期渲染器,用户界面的显示也会更加友好。

    Javascript凌厉开发 Ext详解与实践 书本代码 新闻发布系统源码

    2. 视图(Views):展示新闻列表、详情页等,通过Ext组件如GridPanel、FormPanel等实现。 3. 控制器(Controllers):负责视图间的交互逻辑,监听事件并响应,实现页面间的导航和数据操作。 4. 存储(Stores):管理...

    Ext.Net与MVC的结合使用

    2. **Ext.Net控件使用**:Ext.Net提供了诸如GridPanel、FormPanel、TreePanel等众多控件,它们可以方便地与MVC模型数据绑定,实现数据的展示、编辑和验证。 3. **数据绑定**:使用Ext.Net的数据绑定机制,可以将...

    ext.net与ADO.NET增删改查操作

    "admin"可能是应用程序的管理界面目录,包含用于执行增删改查操作的EXT.NET控件,如GridPanel、FormPanel等。这些控件可以绑定到数据源,并通过EXT.NET的事件处理机制(如button的click事件)调用后台的C#方法执行...

    EXT2.0 API文档

    1. **组件系统**:详细介绍了EXT中的各个组件,如GridPanel、FormPanel、TreePanel等,以及如何配置它们的属性、事件和行为。 2. **布局管理**:讲解EXT2.0中的各种布局模式,如Fit布局、Table布局、Border布局等,...

    EXT2.0帮助文档CHM版

    EXT的FormPanel组件则提供了丰富的表单元素,如文本框、下拉框、复选框等,以及表单验证和数据绑定功能。开发者可以利用这些组件创建复杂的用户输入表单,并与服务器端进行数据交互。 EXT的布局系统是其灵活性的...

    Ext_2.2_API(chinese).rar_Ext 2.2 API_ext js 2_ext-2.2 api_ext2.2

    `Ext.grid.GridPanel`则是一个数据展示组件,常用于表格数据的展示和操作。每个类都详细说明了其构造函数、配置选项、事件处理函数以及方法的使用。 在API文档中,开发者还可以找到关于布局管理、数据绑定、Ajax...

    Ext范例,增删改查,树,界面设计

    此外,ExtJS提供了丰富的事件处理机制,允许开发者在用户与树交互时进行定制化处理。 "界面设计Viewpoint"在Web开发中指的是用户界面的布局和样式。在ExtJS中,Viewpoint可能指的是应用的主要视图或者一个特定的...

    EXT js 实例 学生成绩管理

    EXT JS 的 GridPanel 和 FormPanel 组件非常适合构建这类视图。 3. **控制器(Controller)**:控制器负责协调视图和模型之间的交互。在学生成绩管理中,控制器可以监听用户的操作,如点击按钮添加新学生、编辑成绩...

    ext精典例子(增删改查)

    文件名“JsonExt”表明例子可能涉及到EXT与JSON数据格式的交互。JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,非常适合在JavaScript和服务器之间传输数据。EXT支持直接处理JSON数据,因为它们...

Global site tag (gtag.js) - Google Analytics