`
hcmfys
  • 浏览: 356294 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

FormPanel 使用

    博客分类:
  • ext
阅读更多
往Ext.Window中放一个Ext.form.FormPanel,FormPanel有一个属性为url,可以设置其的值,可参照下面的代码:
//Form表单
var addManagerInfoForm = new Ext.form.FormPanel({
  labelAlign:'right',
  labelWidth:70,
  frame:true,
  url:'manage/manager/addManagerInfo.jsp?command=addManagerInfo',
  items:[ mNameField,mPwdField,mEmailField,mTureNamePwdField,mPhoneField ],
  buttons:[{
   text:'提交',
   handler:function(){
    var f = addManagerInfoForm.getForm();
    if(!f.isValid()) return;
    if(f.isValid()){
     f.submit({
      waitMsg:'处理中,请稍候...',
            success:function(form, action){
             if(action.result.changeManagerInfoOK===false){
              Ext.Msg.alert('信息',action.result.msg);
              return;
             }
             Ext.MessageBox.alert('提示','修改成功!',function(btn){
                               f.reset();
                               addInfoWin.hide();
                               window.history.back(-1);
                            });
            },
            failure:function(){
             Ext.Msg.alert('错误','出现异常,请重新尝试一次!');
            }
     });
    }
   }
  },{
   text:'重置',
      type:'reset',
      handler:function(){
                addManagerInfoForm.getForm().reset();
            }
  },{
            text:'取消',
   handler:function(){
    addManagerInfoForm.getForm().reset();
    addInfoWin.hide();
    window.history.back(-1);
   }
  }]
});

//添加窗口
var addInfoWin = new Ext.Window({
  title:'修改个人信息',
  plain: true,
  autoHeight:true,
  width:300,
  closeAction:'hide',
  items:[addManagerInfoForm]
});
分享到:
评论

相关推荐

    Ext table布局实例 formpanel的table布局

    1. **form layout**:设置`layout: 'form'`,让formpanel使用form布局,这是一种默认的布局方式,自动根据组件宽度进行排列。 2. **table layout**:若要切换到table布局,需设置`layout: { type: 'table', columns...

    ExtJS笔记----FormPanel的使用

    NULL 博文链接:https://lucky16.iteye.com/blog/1490278

    extjs中的formPanel以及表单的应用

    FormPanel 是 ExtJS 中的一个核心组件,用于创建和处理表单元素,包括输入字段、按钮、选择框等。它提供了丰富的功能,如数据验证、远程提交、异步加载等,是构建用户交互界面的关键部分。 在ExtJS中,FormPanel是...

    FormPanel的插入与删除

    7. **最佳实践**:动态操作FormPanel时,应遵循最佳实践,如延迟加载未使用的字段以减少初始加载时间,使用合适的布局管理器优化空间利用,以及确保数据验证和提交逻辑的健壮性。 总结起来,这篇博客内容涵盖了...

    自我扩展FormPanel 和Store

    此外,还可以使用`bind`配置项,实现双向数据绑定,即Store中的数据改变会更新表单,反之亦然。 在实际开发中,自我扩展FormPanel和Store可以帮助我们创建更加灵活、可维护的代码结构。通过自定义扩展,我们可以...

    treeGrid目录拖动到formPanel

    例如,使用Chrome开发者工具来观察DOM变化、追踪网络请求和调试JavaScript代码。 总结起来,将`treeGrid`目录拖放到`formPanel`涉及了`ExtJS`的拖放API、事件处理、数据同步和UI交互等多个方面。理解并熟练运用这些...

    sencha的ajax+formpanel+google地图

    在“sencha的ajax+formpanel+google地图”这个主题中,我们将深入探讨如何使用Sencha Touch与Ajax、FormPanel以及Google Maps API集成,来创建一个具有数据提交和地图展示功能的应用。 首先,`app.html`是应用的...

    ExtJs中表单formPanel的横向布局

    本文将深入探讨如何在ExtJs中使用`FormPanel`组件结合`form`和`column`布局属性来实现横向布局,即在一个表单中元素能够按照列分布,形成一种更为直观和用户友好的界面设计。 ### 一、理解`FormPanel`及其属性 `...

    extJs中关于formPanel动态添加组件的验证问题

    3. **更新验证状态**:如果在表单已经初始化并显示的情况下添加字段,可能需要手动触发FormPanel的验证,可以使用`formPanel.getForm().isValid()`来检查整个表单是否有效。 4. **错误处理**:当验证失败时,EXT JS...

    extjs4如何给同一个formpanel不同的url_.docx

    在EXTJS4中,FormPanel是一个非常重要的组件,用于创建包含表单元素的用户界面。在某些场景下,我们可能...在进行EXTJS开发时,深入理解组件的工作原理和API使用,可以帮助我们更好地设计和实现复杂的用户界面逻辑。

    formpanel extjs

    extjs formpanel学习,秘诀,笔记

    Extjs学习笔记之二 初识Extjs之Form

    以下是一个简单的FormPanel使用示例,这个例子创建了一个包含姓名、密码、邮箱和年龄字段的登录表单: ```javascript var loginForm = new Ext.form.FormPanel({ title: 'A Simple FormPanel', height: 300, ...

    Extjs4的FormPanel从后台load json数据的要点

    在本篇文章中,我们将深入探讨如何使用Extjs4中的FormPanel组件从后台加载JSON数据,并将其映射到表单的各个字段中进行显示。这是一项非常实用的技术,尤其是在需要动态填充表单的情况下。 ### 一、Extjs4 ...

    .archExtJs2.0学习系列(7)--Ext.FormPanel之第四式(其他组件示例篇).doc

    在本文中,我们将深入探讨ExtJS 2.0中的FormPanel组件,并通过具体的示例来了解如何使用不同的组件,如checkbox、radio以及htmleditor。首先,Ext.FormPanel是ExtJS中用于创建表单的主要组件,它允许我们构建复杂的...

    ExtJS4如何给同一个formpanel不同的url

    2. 使用`getForm()`方法获取FormPanel的内部BasicForm实例。 3. 通过BasicForm的`url`属性动态地设置提交地址。 这样,我们就可以灵活地为同一个FormPanel组件指定不同的提交路径,提高了代码的可维护性和组件的...

    简单的两种Extjs formpanel加载数据的方式

    在ExtJS中,`Ext.form.Panel`(或简称为`formpanel`)是一种非常重要的组件,用于创建表单来收集用户输入的数据。本文将详细介绍两种在ExtJS formpanel中加载数据的方法,以供开发者参考。 ### 方法一:使用`...

    ExtJs4.0 表单提交Demo

    ExtJs 4.0 提供了多种类型的表单字段,如文本输入框、密码框、选择框等,以及表单容器,如Panel、FormPanel。这些组件允许开发者创建复杂且功能完备的表单。表单字段可以通过配置项定义,包括字段类型、验证规则、...

    ExtJs 动态添加表单

    在ExtJS中,我们可以使用`Ext.container.Container`类来创建一个容器,然后设置布局为`form`,以便容纳表单字段。例如: ```javascript var formPanel = Ext.create('Ext.form.Panel', { layout: 'form', items...

Global site tag (gtag.js) - Google Analytics