`

ext--Ajax

    博客分类:
  • Ext
ext 
阅读更多
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>ajax.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <link rel="stylesheet" type="text/css" href="/web/ext/resources/css/ext-all.css" />
    <!-- GC -->
 	<!-- LIBS -->
 	<script type="text/javascript" src="/web/ext/adapter/ext/ext-base.js"></script>
 	<script type="text/javascript" src="/web/ext/adapter/ext/ext-all.js"></script>
 	<!-- ENDLIBS -->

    <script type="text/javascript" src="/web/ext/ext-all-debug.js"></script>
    <script type="text/javascript">
    	Ext.onReady(function(){
			Ext.Ajax.request({
			   url: 'time!getTime.action',
			   success: function(response, opts) {
			   	Ext.Msg.alert("success",response.responseText);
			      //var obj = Ext.decode(response.responseText);
			      //console.dir(obj);
			   },
			   failure: function(response, opts) {
			      //console.log('server-side failure with status code ' + response.status);
			      Ext.Msg.alert("failure",response.status);
			   },
			   params:{
			   	name:'test'
			   }
			});
			
			// 提交表单。
			var button = new Ext.Button(
				{
					text:"提交表单",
					renderTo:document.body,
					handler:function(){
						Ext.Ajax.request(
							{
								form:'myform',
								params:'name'
							}
						);
					}
				}
			);		
			
			Ext.get("json").on("click",function(){
				Ext.Ajax.request(
					{
					 url:"time!getJson.action",
					 success:function(response,config){
					 	var json = Ext.util.JSON.decode(response.responseText);
					 	Ext.Msg.alert("","name="+json.name+",age="+json.age);
					 },
					 failure:function(response,config){
					 	Ext.Msg.alert("","抱歉,请求失败!");
					 }
					}
				);
			});
			
			Ext.get('uploadBtn').on('click',function(){
				//var form = Ext.get('upload').dom;
				var form = document.forms[1];
				//alert(form==Ext.get('upload').dom);
				form.target = id; // 链接form与iframe
				form.method = "post"; //必须是post
				form.enctype = form.encoding = "multipart/form-data";
				var url = "time!doUpload.action"; // 表单提交地址。
				if(url) {
					form.action = url;
				}
				Ext.Ajax.request(
					{
						url:"time!doUpload.action",
						isUpload:true,
						form:"upload",
						success:function(response,cfg){
							var result = Ext.util.JSON.decode(response.responseText);
							Ext.Msg.alert("msg",result.msg);;
						},
						failure:function(response,cfg){
							var result = Ext.util.JSON.decode(response.responseText);
							Ext.Msg.alert("msg",result.msg);
						}	
					}
				);
			});
			
		
		});
	</script>
  </head>
  
  <body>
    	<form action="time!submitForm.action">
    		<input type="text" name="name" id="name">
    	</form>
    	
    	<input type="button" id="json" value="Json">
    	<div>
    		<span>Ajax文件上传</span><br>
	    	<form id="upload">
	    		<label>选择上传文件:</label>
	    		<input type="file" name="file">
	    		<br>
	    		<label>文件描述:</label>
	    		<textarea rows="4" cols="50" name="fileDesc"></textarea>
	    		<input type="button" value="上传文件" id="uploadBtn">
	    	</form>
    	</div>
  </body>
</html>



分享到:
评论

相关推荐

    ext-base.js

    EXT是一个基于JavaScript和Ajax技术的开源框架,由Sencha公司开发。它的主要特点是提供了一套完善的组件模型,包括各种UI控件如表格、树形视图、菜单、窗口、表单等,以及强大的数据绑定机制。EXT框架使得开发者能够...

    Ext3-Js-Ajax框架-分页标签-自动排序-文件上传

    Ext3-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动排序-文件上传Ext-Js-Ajax框架-分页标签-自动...

    js ext-4.0.7-gpl

    7. **Ajax支持**:内置的Ajax工具使异步数据通信变得简单,可以轻松实现与服务器端的数据交换。 8. **主题定制**:提供了多种预设主题,并支持自定义主题,以满足不同项目的视觉需求。 9. **性能优化**:通过延迟...

    ext-basex.js 进行Ext.Ajax.request 同步请求 FF无法正常

    在JavaScript编程中,`Ext.Ajax.request`是Ext JS库中的一个核心方法,用于发起Ajax(异步JavaScript和XML)请求。它允许开发者与服务器进行数据交互,无需刷新整个页面,提高了用户体验。然而,当你尝试将`Ext.Ajax...

    ext-js3.2 中文API,例子,包全都有

    4. **Ajax支持**:提供强大的Ajax通信功能,易于与服务器进行异步数据交换。 5. **拖放功能**:支持拖放操作,使得用户界面更加互动。 6. **丰富的UI组件**:包括表格、表单、树形视图、菜单、工具提示、对话框等...

    EXT-GWT(GXT)2.2.3 API DOC.zip

    3. **远程通信**:GXT提供了对Ajax和JSON的支持,方便与服务器进行异步通信,实现数据的加载和保存。 4. **布局管理**:GXT有多种布局模式,如Fit布局、Form布局、Border布局等,帮助开发者组织和管理组件的位置和...

    ext-air-3.1.0和ext-core-3.1.0

    - **功能**:包括DOM操作、事件处理、动画效果、AJAX通信、拖放功能等基础组件,适用于那些不需要完整Ext JS库的轻量级项目。 - **优势**:代码体积小,加载速度快,适合对性能有较高要求的网站或应用。 - **API*...

    ext-3.4.0.rar

    8. **AJAX和异步通信**:Ext JS内置了AJAX组件,如AjaxProxy,用于与服务器进行异步数据交换,支持JSONP和JSONP-like的跨域请求。 9. **主题和皮肤**:框架提供了多种预设主题,如“gray”,“access”,允许开发者...

    磁盘目录树(EXT-js)

    在实际应用中,可能还需要与后端服务器进行交互,获取或保存用户的选择,这就涉及到Ajax通信和JSON数据交换。EXT-js的API文档和社区资源非常丰富,可以帮助开发者解决在实现过程中遇到的问题。 总之,“磁盘目录树...

    Ext-js 2.2

    4. **Ajax支持**:通过AJAX技术,Ext-js可以轻松地与服务器进行异步通信,更新页面内容而无需刷新整个页面。 5. **事件驱动**:所有组件都支持事件监听和触发,使得用户交互和组件间的通信变得简单。 6. **表单...

    Ajax-chrome-ext-page-size.zip

    Ajax-chrome-ext-page-size.zip,报告页面大小、缓存使用情况、网络请求、加载时间的Chrome扩展,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,...

    ext-gwt分页 鉴于网上关于ext-gwt的技术文章很少代码页很少本着开源的精神本人特地写了一个分页的组件供大家学习欢迎下载

    EXT-GWT,全称是Ext GWT,是Sencha公司推出的一个用于构建富客户端Web应用的JavaScript库。它基于Google的GWT(Google Web Toolkit)技术,提供了丰富的用户界面组件和强大的数据绑定机制,使得开发者可以使用Java...

    基于ext-core的ajax自动保存功能

    ### 基于ext-core的ajax自动保存功能详解 在当今快速发展的互联网世界中,用户体验是产品设计的核心考量之一。特别是在长时间编辑文本的场景下,如撰写博客或邮件,自动保存功能成为提升用户体验的关键特性。本文将...

    ext-3.3.1.rar

    extjs ajax 框架 extjs ajax 框架extjs ajax 框架

    ext-1.0源码+部分中文解读

    EXT-1.0支持Ajax异步通信,使得页面可以在不刷新的情况下与服务器交换数据。同时,它使用JSON(JavaScript Object Notation)作为数据交换格式,提高了数据传输效率和解析速度。 7. **表单和验证** EXT-1.0提供了...

    ajax-ext框架

    **Ajax-ext框架详解** Ajax-ext框架是一款强大的JavaScript库,专为构建富客户端应用程序而设计,它结合了Ajax技术的优势和ExtJS库的功能,提供了一种高效、可扩展的方式来实现动态和交互式的Web应用。框架的核心...

    发现一个不错的ajax开发框架ext-1.0.1

    博文链接:https://superbo8888.iteye.com/blog/80111

    ext-4.1.1a

    7. **Ajax和RESTful接口**:ExtJS方便与服务器端进行异步通信,支持JSONP和XML格式的数据交换,4.1.1a版本可能优化了对RESTful API的支持。 8. **触摸支持**:随着移动设备的普及,4.1版本开始增加了对触摸事件的...

    ext-4.2.1-gpl.zip

    对于商业用户,他们可能还会关注如何与后端服务器进行数据交互,例如通过Ajax或WebServices。同时,考虑到性能和用户体验,他们可能需要学习如何优化代码和资源加载,以及如何利用缓存策略。 总的来说,ext-4.2.1-...

    ext-2.2.zip (oozie打开web界面所需的js文件)

    5. **AJAX支持**:通过EXT JS,可以轻松实现异步请求,这对于与服务器通信并实时更新界面至关重要。 6. **可访问性**:EXT JS考虑了无障碍设计,使得有特殊需求的用户也能使用其构建的界面。 综上所述,"ext-2.2....

Global site tag (gtag.js) - Google Analytics