`
hackbomb
  • 浏览: 212625 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

extjs表单的非ajax提交方式

    博客分类:
  • Ext
阅读更多

ext
EXT提交服务器的三种方式(转)
EXT表单的非ajax提交
使用extJs 2.0的form提交表单(非AJAX方式) [转]
-----------------------------------------------------------------------

HTML页面
-----------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>New Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="lib/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="lib/ext/adapter/ext/ext-base.js">
</script>
<script type="text/javascript" src="lib/ext/ext-all.js">
</script>
</head>
<script type="text/javascript">
var simple;
Ext.onReady(function(){
simple = new Ext.form.FormPanel({
renderTo: "loginForm",
labelWidth: 75, // label settings here cascade unless overridden
method: 'POST',
frame: true,
title: '登录窗口',
bodyStyle: 'padding:5px 5px 0',
width: 300,
defaults: {
width: 200
},
defaultType: 'textfield',
//实现非AJAX提交表单一定要加下面的两行!
onSubmit: Ext.emptyFn,
submit: function(){
this.getEl().dom.action = 'login.do'; //连接到服务器的url地址
this.getEl().dom.submit();
},

items: [{
fieldLabel: '用户名',
id: 'username',
name: 'name',
allowBlank: false,
width: 150
}, {
fieldLabel: '密码',
id: 'password',
name: 'pwd',
allowBlank: false,
width: 150,
inputType: 'password'

}],
buttons: [{
text: '登录',
type: 'button',
id: 'login',
handler: login //添加事件,执行函数为login()
}, {
text: '重置',
type: 'reset',
id: 'clear',
handler: reset //添加事件,执行函数为reset()
}]
});

});

function login(){
simple.form.submit();
}

function reset(){
simple.form.reset();
}
</script>
</head>
<body>
<div id="loginForm">
</div>
</body>
</html>


-----------------------------------------------------------------------
Struts Action部分

-----------------------------------------------------------------------
package com.yourcompany.struts.action;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
import org.apache.struts.actions.DispatchAction;
import com.yourcompany.struts.form.LoginForm;

public class LoginAction extends DispatchAction {

public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {

String username = request.getParameter("name");
String password = request.getParameter("pwd");
System.out.println("我的用户名:" + username);
System.out.println("我的密码:" + password);
return null;
}
}

分享到:
评论
1 楼 machaojame 2009-03-04  
Thanks!

相关推荐

    ExtJs4.0 表单提交Demo

    一个简单的ExtJs4.0搭建环境,利用Ext Ajax的方式提交表单,可使得显示层和控制层完全分开.

    Extjs4.1.1

    ExtJS是一种主要用于创建前端用户界面,是一个基本与后台技术无关的前端ajax框架,本课程是一套基于Extjs4.1.1版本进行全新讲解Extjs的课程。课程从基础开始,配合项目实战应用,让用户在最短的时间内掌握Extjs的...

    extjs4.0 实现了主页面框架 动态菜单 例子 表单 ajax

    extjs4.0 实现了主页面框架(主框架使用Ext.Viewport,banner使用Ext.panel.Panel,通过toolbar来放置按钮),包括左侧动态菜单实现(采用Ext.tree.Panel)动态从数据库加载数据来显示菜单(后台代码也在了通过json...

    基于EXTJS的表单输入判断及ajax提示框效果.rar

    一个使用了EXTJS框架的表单检测判断,及提示效果,当输入类型不符时,会无刷新弹出提示框,在本演示代码的基础上,你可轻松扩展出一个界面漂亮的EXT登录界面,不过觉得ExtJs用了大量的图片来美化界面,貌似会影响...

    深入浅出Extjs4.1.1

    4、ExtJS最常用的表单之textfield控件4 |4 ]8 ~/ d3 Y& k# X 5、ExtJs最常用表单组件Number、CheckBox、Radio* s, r% ~+ k; y# W 6、ExtJs最常用表单组件ComboBox、time、date 7、ExtJS面板Panel t1 E( w8 g6 ?/ L' ...

    extjs 前后台交互参数出现中文乱码问题的解决方法

    在使用myeclipse过程中,我使用ajax同步请求传递参数到后台却出现中文乱码,这是我解决问题的代码,希望对您有所帮助

    extjs各种常用组件归纳总结

    extjs各种组件的详细实现及各种扩展归纳总结,包括各种grid,tree,布局,表单,ajax,弹出框等

    精通JS脚本之ExtJS框架.part2.rar

    7.3 ExtJS表单组件的综合应用 第8章 设计表格类布局 8.1 表格简介 8.1.1 表格的基本属性 8.1.2 制作第一个表格 8.2 表格常用功能详解 8.2.1 主要属性功能 8.2.2 自定义列宽度 8.2.3 执行按列排序 8.2.4 ...

    轻松搞定Extjs_原创

    三、提交表单至服务器 97 四、小结 100 第十六章:更多表单组件 102 一、您能说出哪些表单组件呢? 102 二、表单组件关系图 102 三、组件配置选项介绍 103 四、完整源代码 107 五、小结 112 第十七章:悬停提示与...

    ExtJS Web应用程序开发指南(第2版)

    然后通过4章来详细讲解ExtJS的基本功能,包括:最常用的表单、面板和布局类,常用的工具类与函数,以及ExtJS对事件的响应。本书还结合现今流行的Web框架进行改造,将相关技术融合起来应用。Ajax已经逐渐渗透到Web...

    深入浅出ExtJS PDF 扫描版

    通过学习本书,读者将感受到ExtJS的无穷魅力和Ajax技术带来的完美体验。 本书适合有一定CSS和HTML基础的开发者阅读。 目录: 第1章 EXT概述 第2章 EXT框架基础 第3章 表格控件 第4章 表单与输入控件 第5章 树形结构 ...

    ExtJSWeb应用程序开发指南(第2版)

    4.3.3 Ajax模式的表单数据提交 4.3.4 标准模式的表单数据提交 4.3.5 使用Direct技术 4.4 本章小结 第5章 面板及布局类 5.1 面板panel 5.1.1 认识Ext.panel.Panel 5.1.2 Ext.panel.Panel的主要功能 5.1.3 ...

    深入浅出ExtJS学习PDF 文档下载

    通过学习本书,读者将感受到ExtJS的无穷魅力和Ajax技术带来的完美体验。 本书适合有一定CSS和HTML基础的开发者阅读。 目录: 第1章 EXT概述 第2章 EXT框架基础 第3章 表格控件 第4章 表单与输入控件 第5章 树形结构 ...

    ExtJS Web应用程序开发指南(第2版)

    然后通过4章来详细讲解ExtJS的基本功能,包括:最常用的表单、面板和布局类,常用的工具类与函数,以及ExtJS对事件的响应。《ExtJS Web应用程序开发指南(第2版)》还结合现今流行的Web框架进行改造,将相关技术融合...

    ExtJS Web应用程序开发指南

    针对ExtJS的Web开发技术,从基础的运行平台的搭建开始讲起,层层深入各个表单、面板和布局的灵活运用,接着剖析详细组件和函数,把Ajax与ExtJS完美结合。  ·对数据模型、高级组件和Struts和Struts 2框架实现整合...

    ExtJS Web 应用程序开发指南(第2版)(完整版)

    主要内容:ExtJS4.0的基本功能、最常用的表单、面板及布局类、常用工具类与函数、让ExtJS开始响应事件、常见Web框架的ExtJS改造、ExtJs对Ajax69支持、增强型模板、数据模型、Grid组件、Tree组件、ExtJs与服务端框架...

    ExtJS 3.3.1正式版下载

    ExtJS是一种主要用于创建前端用户界面,是一个与后台技术无关的前端ajax框架。功能丰富,无人能出其右。无论是界面之美,还是功能之强,ext的表格控件都高居榜首。 此地址可下载ExtJS3.2中文说明 ...

    精通JS脚本之ExtJS框架.part1.rar

    7.3 ExtJS表单组件的综合应用 第8章 设计表格类布局 8.1 表格简介 8.1.1 表格的基本属性 8.1.2 制作第一个表格 8.2 表格常用功能详解 8.2.1 主要属性功能 8.2.2 自定义列宽度 8.2.3 执行按列排序 8.2.4 ...

    ExtJS Web应用程序开发指南(1-10)

    ·针对ExtJS的Web开发技术,从基础的运行平台的搭建开始讲起,层层深入各个表单、面板和布局的灵活运用,接着剖析详细组件和函数,把Ajax与ExtJS完美结合。 ·对数据模型、高级组件和Struts和Struts 2框架实现整合...

Global site tag (gtag.js) - Google Analytics