`

EXTJS FORM技巧

    博客分类:
  • EXT
阅读更多

版权声明 :转载时请以超链接形式标明文章原始出处和作者信息及本声明
http://sunhuang.blogbus.com/logs/36463408.html

Q:如何使表单不使用AJAX方式提交?
A:给form加上以下配置

onSubmit: Ext.emptyFn,
        submit:function() {
this.getForm().getEl().dom.action = this.url;
this.getForm().getEl().dom.submit();
            },

因为EXTJS的BUTTON就算指定了TYPE为SUBMIT也不能提交,所以,对于需要提交的按钮,要加上事件处理函数:

handler:function(){
                form1.submit();            
            }

这样,表单就会以普通方式提交了.
Q:如何为表单加上Reset重置按钮?
A:虽然你可以将BUTTON的TYPE改为RESET,但是,实际上,还是要你自己处理复位.下面的代码可以复位表单

handler:function() {
                form1.form.reset();
            }

注 意,要把这里的form1改为你的formpanel名称,这里很变态的一点就是,对于submit按钮,我们可以用form1.submit(),但是 reset按钮,竟然无法用form1,reset,竟然要用form1.form.reset(),太不可思议了
Q:如何在表单提交前进行统一验证?
A:这个问题,我也曾苦恼过,查了EXTJS的FORUM才解决
首先,要将提交按钮和FORM绑定,在BUTTON配置中加以下内容:

formBind:true,

然后,在FORM中要加以下配置:

monitorValid:true,

这样,提交按钮就与表单的验证绑在一起了,只有全部验证通过时,表单提交按钮才是enable的,否则,该按钮不可以点击
虽然解决了问题,但是,却不是很灵活,希望下一版能改进吧.
Q:为何传给GRID的XML数据显示不出来?
A:Grid的XML数据,除了必须是普通的XML文件外,还有一个潜在的解析要求,那就是至少要有根节点,表节点和记录节点这三级
否则,将显示不出数据,但不会报错
Q:为何动态传递ASP生成的XML数据给GRID却显示不出来?
A:普通XML作为GRID数据能显示,而ASP生成的却不行,原因是ASP生成的XML在生成时没有指明Content-Type,只要在代码开始加上:Response.contentType="text/xml"即可

分享到:
评论

相关推荐

    ExtJs 动态添加表单

    ExtJS 是一个强大的JavaScript库,...总之,动态添加表单是ExtJS开发中的一个重要技巧,它允许我们根据用户交互或程序逻辑灵活地调整表单结构。结合源码和工具,开发者可以构建出高度可定制和交互性强的Web应用界面。

    ExtJs获取表单元素的值

    下面将从几个方面展开讨论:ExtJs表单的基本概念、获取表单元素值的方法、实际应用中的技巧以及一些进阶用法。 ### 一、ExtJs表单的基本概念 ExtJs是一款基于JavaScript的开源前端框架,用于构建交互式的Web应用...

    ExtJs 实例+ExtJs中文教程(学习extjs必备)

    通过学习这些实例,你可以更好地理解如何在实际项目中应用ExtJs,例如如何创建网格(Grid)、表单(Form)、树形视图(Tree)、面板(Panel)等。实例通常包括完整的HTML、CSS和JavaScript代码,以及详细的解释,...

    ExtJs2.0学习系列

    ExtJS 2.0的组件系统是其核心部分,包括各种UI元素,如按钮(Button)、表格(Grid)、面板(Panel)、表单(Form)等。这些组件可以独立使用,也可以组合构建复杂的用户界面。学习ExtJS 2.0时,理解每个组件的功能...

    extjs 学习心得笔记

    在探讨《ExtJS学习心得笔记》这一主题时,我们不仅会深入理解ExtJS框架的核心概念与实践技巧,还会从新手的角度出发,提炼出一系列有助于快速上手的学习策略,避免常见的学习陷阱,确保学习过程高效而有成效。...

    Extjs3.0 cookbook

    **EXTJS 3.0实战技巧** 1. **自定义组件(Custom Components)**:EXTJS允许开发者创建自定义组件,扩展其功能以满足特定需求。 2. **主题(Themes)**:EXTJS 3.0支持皮肤和主题,开发者可以根据品牌或设计需求...

    extjs4中文文档

    2. **布局管理**:EXTJS4提供多种布局方式,如Fit布局、Border布局、Form布局等,能够灵活地调整组件在页面上的排列和尺寸。 3. **数据绑定**:EXTJS4支持双向数据绑定,使得视图与模型之间的数据同步变得简单,...

    extjs3.0开发包含示例api

    3. **布局管理(Layouts)**:EXTJS支持多种布局方式,如Fit、Border、Form、Table等,可以方便地组织和调整组件的布局。 4. **Ajax和数据存储(Ajax and Data Stores)**:提供了XML、JSON等格式的数据读取和写入...

    extjs 复选下拉框的例子

    在ExtJS中,实现这一功能主要依赖于`Ext.form.MultiSelect`组件,但它可以通过自定义配置来模仿`ComboBox`的行为,同时支持多选。 #### 示例代码解析 在提供的代码片段中,首先定义了一个数据数组`data`,包含了多...

    Ext combobox 下拉多选框带搜索功能

    在IT行业中,Ext JS是一个广泛使用的JavaScript库,用于构建富客户端Web应用程序。...通过深入研究源码和示例,开发者可以掌握更多关于Ext JS组件自定义和优化的技巧,这对于提升Web应用的用户体验具有重要意义。

    ExtJS中文手册.doc

    2. **组件库**:详述各种组件的使用方法,如Grid面板、Form表单、Tree视图、Charts图表等。 3. **布局管理**:讲解如何配置和使用不同的布局类型,以适应不同屏幕尺寸和设备。 4. **数据绑定**:阐述Store、Model和...

    Extjs 性能优化 High Performance ExtJs

    ### Extjs 性能优化详解 #### 一、前言 在前端开发中,Extjs 是一款非常强大的 UI 框架,它提供了丰富的组件和便捷的开发方式,...开发者应该根据实际需求灵活应用各种优化技巧,从而构建出既高效又稳定的前端应用。

    资料:包括extjs2.0源码

    通过深入EXTJS 2.0的源码,开发者不仅可以提升EXTJS的使用技巧,还能学习到JavaScript编程的最佳实践,对于前端开发者来说是一份宝贵的资源。不过,由于EXTJS后续版本(如EXTJS 4.x、6.x及更高版本)引入了许多新...

    extjs资料大全

    3. **组件与API**:ExtJS的核心是其组件系统,如Grid、Form、Panel、Tree等,这些组件都有各自的API,通过阅读文档,开发者可以了解如何创建、配置和操作这些组件。 4. **数据管理**:ExtJS的Store和Model机制使得...

    extjs_asp.net.rar_extjs_extjs 网站

    在解压后,开发者可以运行这些示例,查看它们的工作原理,甚至逐步调试和修改代码,以便更好地理解和掌握ExtJS与ASP.NET的集成技巧。 总的来说,这个压缩包是一个为初学者准备的教育资源,涵盖了使用ExtJS构建ASP...

    extjs grid.panel 项目 源码

    在基于ExtJS Form表单的项目中,Grid Panel通常用于显示和编辑由Form表单收集或处理的数据。 源码分析可以从以下几个方面展开: 1. **组件创建**:首先,我们需要了解如何创建一个Grid Panel。这通常涉及到定义...

    Extjs自动最大化panel

    它提供了丰富的组件系统,包括Panel、Grid、Form等,而Panel是EXTJS中的核心组件之一,可以视为一个可自定义的容器,可以包含其他组件。 在传统的EXTJS中,`viewport`是一个特殊的布局,用于将整个页面作为其渲染...

    extJS 一些简单实例

    例如,`Ext.data.Model` 和 `Ext.data.Store` 可以帮助我们管理数据模型和数据存储,而`Ext.form.Panel`则提供了创建复杂表单的能力。 在描述中的博文链接中,可能详细讲解了如何使用ExtJS创建一个简单的应用。通常...

    ExtJS.in.Action

    第六章“ExtJS takes form”则专注于表单的处理,包括如何构建表单、验证数据以及提交数据等。 ### 数据驱动的组件应用 第三部分“Data-Driven Components”主要聚焦于如何利用ExtJS来处理数据密集型的应用场景。...

    Extjs优化(二)Form表单提交通用实现

    函数内部使用了EXTJS的API进行操作,如`getForm()`用于获取表单对象,`submit()`用于提交表单,并且通过`scope`指定回调函数的上下文,`url`定义了提交的URL,`method`指定了HTTP方法,`params`包含了额外的请求参数...

Global site tag (gtag.js) - Google Analytics