[ext几个实例.doc

29]Ext.AJAX登录示例--FormPanel 路遥 ?? 发表于2009年04月18日 03:10 阅读(281) 评论(0) 分类： ExtJS学习 举报 ????????上一篇讲解了Ext.Ajax + HTML form表单 + MySQL数据库的完整登录案例;本篇是关于Ext.Ajax + Ext.FormPanel + MySQL数据库的完整登录案例,一个是html的form表单,一个是Ext的FormPanel表单,在提交或结合Ext.Ajax多少还是有区别的. 前台展示页面,其中包含了一个层,目的是使渲染的FormPanel居中显示,代码如下: 下面是ajax_ext_login.js的代码: 后台处理页面和上一篇的一模一样,未作任何改动,代码如下: 后来想了想,总觉得这里不太对劲,最好不要像上面我写的那样返回一段文本提示信息,最好是返回JSON格式的信息(包含登录成功失败的标识和提示信息等),然后在前台解析. 表结构及测试数据: ???????? 页面初始化结束后,直接点击登录按钮,会发现表单并不会提交,而是给出信息提示: ?????? 登录成功效果: ???????? 登录失败效果: ???????? 路遥 ?? 发表于2009年04月18日 01:56 阅读(212) 评论(0) 分类： ExtJS学习 举报 ?????? 本示例演示了Ext.Ajax + HTML form表单 + MySQL数据库的完整登录案例. 首先是本示例展示页面的代码,注意选中的部分,就是一个传统的html form表单,要设置一个id值,代码如下: ajax_login.js的代码只有一个子login方法,方法内部是Ext.Ajax请求,主要注意配置参数form:loginForm,它的意思就是说这个请求是要提交表单loginForm的,代码如下: ???????? Ajax的请求路径是ajaxLoginServer.jsp,下面是该页面的代码: 后来想了想,总觉得这里不太对劲,最好不要像我写的这样返回一段文本信息,最好是返回JSON格式的信息(包含登录成功失败的标识和提示信息等),然后在前台解析.下面是本示例用到的后台数据表: ???????? 账号和密码验证成功的展示页面: ???????? 验证失败的展示页面: ???????? 备注:本示例密码输入框我是有意用明文显示的,目的是为了看清楚输入的内容. 转到我空间复制网址 日志地址: 请用Ctrl+C复制后贴给好友。 隐藏签名档小字体 上一篇 下一篇 返回日志列表 [27]Ext.Ajax入门示例 路遥 ?? 发表于2009年04月18日 00:45 阅读(173) 评论(0) 分类： ExtJS学习 举报 ????????在网上到处都能看到这么一句话:ExtJS是一款功能强大的Ajax框架.为什么前面学了那么多的实例,都只是讲如何表现组件,很少涉及到与后台的交互,那是因为在ExtJS中,许多与后台的交互都是通过Ajax来实现的,还是在搞清楚Ext.Ajax后,再进一步去学习常用的组件与后台交互等. ????????传统的Ajax开发,都是自己创建XMLHTTPRequest对象,并判断响应状态和处理返回的值,这些基本上都是些模块化的操作,Ext.Ajax已经为我们封装好了这些操作,Ajax开发将会变得更容易. ????????Ext.Ajax.Request方式是客户端向服务器端发送请求的重要方法,下面介绍一下它的常用参数: ?????????????? 1. url:请求的服务器地址 ?????????????? 2. params:请求参数串(格式:name=liufengpwd=123) ?????????????? 3. method:HTTP请求方式,有效值GET和POST ?????????????? 4. callback:接收到服务器响应后的处理函数,不管失败与否都会被调用 ?????????????? 5. success:请求成功的回调函数 ?????????????? 6. failure:请求失败的回调函数 ?????????????? 7. form:指定要提交的表单对象或id(这个配置项也比较实用) ????????下面来看一个简单的ajax示例: 注意:这里的页面编码我用的是gb2312. ??????看到了吧,Ext.Ajax真的是很方便了,简单配置几下即可.参数url的值为服务器端的一个txt文件. ???????? ajaxText.txt的内容如上,里面写了三行中文. ???????