extJs常用的四种Ajax异步提交

1. /**
2. *<p>
3. *第一种Ajax提交方式
4. *</p>
5. *<p>
6. *这种方式需要直接使用extAjax方法进行提交
7. *</p>
8. *使用这种方式，需要将待传递的参数进行封装
9. *
10. *@return
11. */
12. functionsaveUser_ajaxSubmit1(){
13. Ext.Ajax.request({
14. url:'user_save.action',
15. method:'post',
16. params:{
17. userName:document.getElementById('userName').value,248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> password:document.getElementById('password').value
18. },
19. success:function(response,options){
20. varo=Ext.util.JSON.decode(response.responseText);
21. alert(o.msg);
22. failure:function(){
23. }
24. });
25. /**
26. *第二种Ajax提交方式
27. *这种方式将为ext的ajax指定一个html表单
28. *使用这种方式，不需要将待传递的参数进行封装
29. *
30. *@return
31. */
32. functionsaveUser_ajaxSubmit2(){
33. Ext.Ajax.request({
34. url:'user_save.action',248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> method:'post',108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> form:'userForm',//指定表单
35. *第三种Ajax提交方式
36. *这种方式将为ext的自己的表单进行提交
37. *使用这种方式，需要使用ext自己的textField组件
38. functionsaveUser_ajaxSubmit3(){
39. //定义表单
40. varformPanel=newExt.FormPanel({
41. labelWidth:75,108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> frame:true,248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> bodyStyle:'padding:5px5px0',108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> width:350,248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> defaults:{
42. 230
43. },
44. defaultType:'textfield',248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> items:[{
45. fieldLabel:'用户名',248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> name:'userName',108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> allowBlank:false
46. fieldLabel:'密码',248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> name:'password'
47. }]
48. //定义窗口
49. varwin=newExt.Window({
50. title:'添加用户',248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> layout:'fit',0); background-color:inherit">500,248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> height:300,108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> closeAction:'close',248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> closable:false,108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> plain: items:formPanel,108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> buttons:[{
51. text:'确定',108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> handler:function(){
52. varform=formPanel.getForm();
53. varuserName=form.findField('userName').getValue().trim();
54. varpassword=form.findField('password').getValue().trim();
55. if(!userName){
56. alert('用户名不能为空');
57. return;
58. }
59. if(!password){
60. alert('密码不能为空');
61. form.submit({
62. waitTitle:'请稍后...',108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> waitMsg:'正在保存用户信息,请稍后...',248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> success:function(form,action){
63. alert(action.result.msg);
64. failure:function(form,action){
65. alert(action.result.msg);
66. text:'取消',248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> handler:function(){
67. win.close();
68. win.show();
69. *第四种Ajax提交方式
70. *这种方式将html的表单转化为ext的表单进行异步提交
71. *使用这种方式，需要定义好html的表单
72. functionsaveUser_ajaxSubmit4(){
73. newExt.form.BasicForm('userForm').submit({
74. }