extJs常用的三种Ajax异步提交

extJs常用的多样Ajax异步提交

 在action中输出的措施为:

HttpServletResponse
response=ServletActionContext.getResponse();

response.setContentType(“text/html”);

response.setCharacterEncoding(“UTF-8”);

response.getWriter().print(“宗龙龙!”);或者response.getWriter().write(“宗龙龙!”);
response.getWriter().flush();
response.getWriter().close();

一旦不写response.getWriter().flush(); 
response.getWriter().close();或者

 

/**
 * 第③种Ajax提交情势
 * 那种方式索要一贯使用ext Ajax方法开展付出
 * 使用那种艺术,须要将待传递的参数举行打包
 * @return
 */
function saveUser_ajaxSubmit1() {
 Ext.Ajax.request( {
  url : ‘user_save.action’,
  method : ‘post’,
  params : {
   userName : document.getElementById(‘userName’).value,
   password : document.getElementById(‘password’).value
  },
  success : function(response, options) {
   var o = Ext.util.JSON.decode(response.responseText);
   alert(o.msg);
  },
  failure : function() {
  }
 });
}
/**
 * 第两种Ajax提交格局
 * 那种艺术将为ext的ajax内定1个html表单
 * 使用那种办法,不要求将待传递的参数举办打包
 * 
 * @return
 */
function saveUser_ajaxSubmit2() {
 Ext.Ajax.request( {
  url : ‘user_save.action’,
  method : ‘post’,
  form : ‘userForm’, // 钦命表单
  success : function(response, options) {
   var o = Ext.util.JSON.decode(response.responseText);
   alert(o.msg);
  },
  failure : function() {
  }
 });
}
/**
 * 第两种Ajax提交情势
 * 那种艺术将为ext的祥和的表单实行提交
 * 使用那种措施,需求使用ext自个儿的textField组件
 * 
 * @return
 */
function saveUser_ajaxSubmit3() {
 // 定义表单
 var formPanel = new Ext.FormPanel( {
  labelWidth : 75,
  frame : true,
  bodyStyle : ‘padding:5px 5px 0’,
  width : 350,
  defaults : {
   width : 230
  },
  defaultType : ‘textfield’,
  items : [ {
   fieldLabel : ‘用户名’,
   name : ‘userName’,
   allowBlank : false
  }, {
   fieldLabel : ‘密   码’,
   name : ‘password’
  } ]
 });
 // 定义窗口
 var win = new Ext.Window( {
  title : ‘添加用户’,
  layout : ‘fit’,
  width : 500,
  height : 300,
  closeAction : ‘close’,
  closable : false,
  plain : true,
  items : formPanel,
  buttons : [ {
   text : ‘确定’,
   handler : function() {
    var form = formPanel.getForm();
    var userName = form.findField(‘userName’).getValue().trim();
    var password = form.findField(‘password’).getValue().trim();
    if (!userName) {
     alert(‘用户名不可能为空’);
     return;
    }
    if (!password) {
     alert(‘密码不可能为空’);
     return;
    }
    form.submit( {
     waitTitle : ‘请稍后…’,
     waitMsg : ‘正在保存用户新闻,请稍后…’,
     url : ‘user_save.action’,
     method : ‘post’,
     success : function(form, action) {
      alert(action.result.msg);
     },
     failure : function(form, action) {
      alert(action.result.msg);
     }
    });
   }
  }, {
   text : ‘取消’,
   handler : function() {
    win.close();
   }
  } ]
 });
 win.show();
}
/**
 * 第三种Ajax提交格局
 * 那种格局将html的表单转化为ext的表单实行异步提交
 * 使用那种措施,必要定义好html的表单
 * 
 * @return
 */
function saveUser_ajaxSubmit4() {
 new Ext.form.BasicForm(‘userForm’).submit( {
  waitTitle : ‘请稍后…’,
  waitMsg : ‘正在保存用户音信,请稍后…’,
  url : ‘user_save.action’,
  method : ‘post’,
  success : function(form, action) {
   alert(action.result.msg);
  },
  failure : function(form, action) {
   alert(action.result.msg);
  }
 });
}

相关文章