extjs4 表單提交 和 Ajax請求 示例
表單的提交form.submit和Ajax請求裡的success和failure回撥函式有點區別,
表單提交後要求後臺返回的必須是json字串,且必須包含success:true 或 success:false,如果不包含這個直接返回一個json字串就會執行failure函式,這個鬱悶我一下午……
Ajax請求則不同,只要後臺返回一個字串就能成功接收到
表單提交(這裡我就直接寫handler了)
handler : function() { var form = me.down('form').getForm(); if (form.isValid()) { form.submit({ url : 'http://localhost:8080/b_springmvc_extjs/formSubmit.do', method : 'POST', waitTitle : "提示", waitMsg : '正在提交資料,請稍後 ……', success : function(form, action) { Ext.Msg.alert('success', 'bbb ' + form + action.result.msg); this.close(); }, failure : function(form, action) { Ext.Msg.alert('failure', 'bbb' + form + action.result.msg); this.close(); } }); } }
後臺
@RequestMapping(value = "/formSubmit.do", method = RequestMethod.POST) @ResponseBody public String formSubmit(@ModelAttribute(value = "user") User user) { if (user != null || !equals("")) { System.out.println(user.getId()); System.out.println(user.getFirstname()); System.out.println(user.getLastname()); try { Thread.sleep(1000 * 2); } catch (InterruptedException e) { e.printStackTrace(); } return "{success:true,msg:'success submit --- yang'}"; } return "{success:false,msg:'failure submit --- xuan'}"; }
然後是Ajax請求,這裡我是監聽一個combo的focus事件(mvc模式)
'frameNorth combo[id=changeSkin]' : {
focus : this.comboFocus
}
comboFocus : function(combo, The, eOpts) { Ext.Ajax.request({ //ajax request test url : 'http://localhost:8080/b_springmvc_extjs/ajaxRequest.do', /* headers: { 'userHeader': 'userMsg' },*/ params : { name : 'yangxuan' }, method : 'POST', success : function(response, options) { Ext.MessageBox.alert('成功', '服務端返回資料 : '+ response.responseText); }, failure : function(response, options) { Ext.MessageBox.alert('失敗', '錯誤編號:' + response.status); } }); },
後臺
@RequestMapping(value = "ajaxRequest.do", method = RequestMethod.POST)
@ResponseBody
public String ajaxRequest(@RequestParam(value = "name") String name) {
if (name != null || !name.equals("")) {
System.out.println("name : " + name);
return "success ajax request";
}
return "fail ajax request";
}
相關推薦
extjs4 表單提交 和 Ajax請求 示例
表單的提交form.submit和Ajax請求裡的success和failure回撥函式有點區別, 表單提交後要求後臺返回的必須是json字串,且必須包含success:true 或 success:false,如果不包含這個直接返回一個json字串就會執行failure函
虛擬表單提交模擬ajax請求
前端開發人員經常會遇到ajax請求出現跨域問題,比如做單點登入。結合本人開發經驗推薦一方法——虛擬表單提交,解決此類問題。此方法的特點是簡單易懂!好了,直接上乾貨! function formCommit(){ var formobj; // window.top.open(
form表單提交和ajax表單提交
相信大家在做itoo的時候都用過ajax非同步提交資料,好處自然不言而喻,資料提交頁面不會閃屏;頁面區域性更新速度快;網路頻寬佔用低。而表單提交則整個頁面重繪。如果表單提交後跳轉到另
Extjs6關於Ajax和form表單提交以及store請求session超時的處理方法
對於Store的處理 每個store配置的時候,配上load監聽,載入時處理: usrStore : { model : 'App.model.Usr', autoLoad :
jquery ajax 實現表單提交和驗證表單
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <title>$.ajax()方法傳送請
轉載:關於ajax,form表單提交,http請求提交的區別
https://www.cnblogs.com/lidgblogs/archive/2017/09/01/7403828.htmlajax模仿form上傳:<!doctype html> <html lang="en"> <head>
java post請求的表單提交和json提交簡單小結
在java實現http請求時有分為多種引數的傳遞方式,以下給出通過form表單提交和json提交的引數傳遞方式: 1 public String POST_FORM(String url, Map<String,String> map,String encoding) throws Pa
FORM表單請求和AJAX請求使用和適用場景
最常使用的兩種資訊提交處理方式 第一種:表單提交FORM Submit 方式 FROM提交是我們經常適用的向後臺提交資料的一種方式,Form Tag 適用方法 參考: <form action="form_action.asp" method="
form表單提交之Ajax版和常用版區別和聯絡。
使用Ajax方法實現form表單的提交 1.區別 聯絡 在使用form表單的時候,一旦點選提交觸發submit事件,一般會使得頁面跳轉,頁面間的跳轉等行為的控制權往往在後端的控制層,後端會控制頁面的跳轉及資料傳遞。 但是當不希望頁面跳轉或者是想要將控制權放
form表單提交轉為ajax方式提交
clas modal 通過 fault IT pre submit sub 方式 <form action="xxx" method="get"> //action的值是請求的url地址 <div class="form-group">
form表單提交與ajax提交的區別
原文地址:https://blog.csdn.net/yao302789/article/details/50954902 Ajax提交是通過js來提交請求,請求與響應均由js引擎來處理,頁面不會重新整理,用 戶感覺不到實際上瀏覽器發出了請求。比如說我們希望網頁總是顯示最新的新聞, 而又不想老是
element-UI表單提交和多餘欄位無法插入問題
表單: <el-form :model="site" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> <el-form-item label="酷站
servlet3.0以上form表單提交(ajax非同步提交)
一、普通form提交 1、jsp <form id="form" method="post" name="upload" enctype="multipart/form-data" action="/index.do"> <input type=
解決HttpClient工具中application/x-www-form-urlencoded表單提交時,請求引數中文亂碼問題
一、引數亂碼現象 當我去請求第三方介面時,介面接收格式為Form表單的時候,使用HttpClient工具類。這時,對於封裝進HttpPost物件裡的請求引數,如果有中文引數,會出現亂碼的現象。 二、程式碼現象復現 controller層 @RestContr
bootstrap兩種按鈕寫法 button 和 a, 可用於表單提交和a不同按鈕連結跳轉
如果一個頁面有兩個處理按鈕,跳轉不同業務,可以用以下方法 <button type="submit" class="btn btn-primary">修改專案</button> (轉向from提交的地址 <a class="bt
微信小程式中form 表單提交和取值例項詳解
我們知道,如果我們直接給 input 新增 bindinput,比如:<input bindinput="onUsernameInput" />,那麼可以在 onUsernameInput 中直接使用 e.detail.value,即: onUsernameInput : function(e)
jQuery表單提交和後臺互動
要求:僅使用jQuery提交表單和後臺互動,不使用基於jQuery的表單外掛方式1、取到頁面控制元件的值後拼接放在data中,傳遞到後臺頁面程式碼:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN
Thymeleaf的普通表單提交與AJAX提交
為Java實體物件新增後臺校驗註解: //String型別的校驗: @NotEmpty -- 不能為空 max=16 -- 最大長度為16 @NotEmpty(message = "songName不能為空") @Size(ma
JSP表單提交和表單校驗
function validate_channel_info(channelform) { if(channelform.channelname.value=="")
表單提交和json提交
背景在前後端分離的開發組中,前端通常對自己程式碼組織的比較細緻,都會對AJAX,或者小程式API做封裝。而很多前端開發對後端介面要求的傳參 一頭霧水,後端開發人員對HTTP一知半解,傳參接收不到,說不清楚,互相推脫,誰誰應該改傳參方式。HTTP協議中:Content-Type