JAVA基礎知識:form的提交方式
Easyui中的form有兩種提交方式、結合自己新新增的一種ajax提交方式、本文簡單說明form的三種提交方式、和結合validatebox使用來校驗基本資訊。希望下文關於form的提交方式介紹對大家學習java有幫助!
form提交
以登入為例:下面是登入頁面、注意要匯入easyui所需要的css和js。
要引入的`css+js:
登入的div和表單:
username: password:
簡單說明:
1、登入是使用dialog來作為介面的、初始化dialog有幾種方式——
(1)使用class="easyui-dialog"定義、使用data-options="xxx"來定義dialog屬性、這種適合只具有基本樣式、不具有與後臺互動功能的時候的頁面使用。(2)使用js初始化、適合與後臺互動的介面使用、(3)可以混合使用。
1、通過ajax提交:
loginAndregist = $('#loginAndregist')og({
closable:false,
modal:true,
draggable:false,
buttons:[{
text:'註冊',
handler:function(){
$('#regist')og('open');
}
},{
text:'登入',
handler:function(){
if( $('#loginInputForm')('validate')){
$({
url:'login_on',
data:$('#loginInputForm')alize(),
cache:false,
dataType:'text',
success:function(r){
(r);
if(r == "success"){
$('#loginAndregist')og('close');
$({
title : '提示',
msg : '登入成功'
});
}else{
$t('標題','使用者名稱密碼錯誤');
}
}
});
}
}
}],
});
簡單說明:if( $('#loginInputForm')('validate')){...}是將form與其內部的validatebox繫結、可以使用validatebox提供的校驗規則來校驗輸入。若不使用這個而直接使用ajax提交、則不會使用validatebox提供的校驗規則、當然也可以自己加校驗方式、onSubmit()。
2、通過先初始化form、再在點選登入觸發函式中提交
初始化form表單:
//初始化登入表單
loginInputForm = $('#loginInputForm')({
url:'login_on',
success:function(r){
(r);
if(r == "success"){
$('#loginAndregist')og('close');
$({
title : '提示',
msg : '登入成功'
});
}else{
$t('標題','使用者名稱密碼錯誤');
}
}
});
點選登入時提交表單:
loginAndregist = $('#loginAndregist')og({
closable:false,
modal:true,
draggable:false,
buttons:[{
text:'註冊',
handler:function(){
$('#regist')og('open');
}
},{
text:'登入',
handler:function(){
it();
}
}],
});
簡單說明:這裡不再需要像ajax一樣新增一個校驗的if、因為這種方式的form是與validatebox繫結的、會自動校驗。
3、直接在點選登入觸發函式中提交
loginAndregist = $('#loginAndregist')og({
closable:false,
modal:true,
draggable:false,
buttons:[{
text:'註冊',
handler:function(){
$('#regist')og('open');
}
},{
text:'登入',
handler:function(){
if( $('#loginInputForm')('validate')){
$('#loginInputForm')('submit',{
url:'login_on',
onSubmit: function(){
('do some check !');
},
success : function(r){
(r);
(r);
if(r == "success"){
$('#loginAndregist')og('close');
$({
title : '提示',
msg : '登入成功'
});
}else{
$t('標題','使用者名稱密碼錯誤');
}
}
});
}
}
}],
});
$('#loginInputForm')('submit',{...})、當點選登入按鈕時會直接提交表單、紅色部分可以對錶單提交之前做一些操作、比如校驗。