加入收藏 | 设为首页 | 会员中心 | 我要投稿 聊城站长网 (https://www.0635zz.com/)- 智能语音交互、行业智能、AI应用、云计算、5G!
当前位置: 首页 > 教程 > 正文

在 jQuery中我们实现了验证表单的格式和顺序

发布时间:2023-09-14 15:07:40 所属栏目:教程 来源:
导读:之前项目中使用的表单提交方式

使用form()方法可以将提交事件脱离submit按钮,绑定到任何事件中

代码如下:

function addSubmit(){

$('#addForm').form('submit', {

url : _base
之前项目中使用的表单提交方式
 
使用form()方法可以将提交事件脱离submit按钮,绑定到任何事件中
 
代码如下:
 
function addSubmit(){
 
$('#addForm').form('submit', {
 
url : _basePath + '/@Controller/@RequestMapping',
 
onSubmit : function() {
 
if(boolean){//放置能否提交的判断条件
 
$.messager.show({
 
title:'提示',msg:'不符合保存条件',
 
showType:'fade',style:{right:'',bottom:''}
 
});
 
return false;//阻止表单提交
 
}
 
return $('#addForm').form('validate');//判断required项是否全部有值
 
},
 
success : function(data) {
 
var obj = jQuery.parseJSON(data);//将返回的JSON转化为所需对象(ResponseData)
 
if (!obj.success) {//判断返回的ResponseData对象中标示状态的属性值
 
$.messager.show({
 
title:'提示',msg:'保存失败',
 
showType:'fade',style:{right:'',bottom:''}
 
});
 
} else {
 
$.messager.show({
 
title:'提示',msg:'保存成功',
 
showType:'fade',style:{right:'',bottom:''}
 
});
 
$("#addWin").window("close");//关闭提交pwkk
 
query();//刷新结果集
 
}
 
}
 
});
 
}
 
今天在《锋利的jQuery》中又读到这样一种提交方式,使用ajax封装了表单内容用post提交
 
代码如下:
 
$("#btn").click(function() {
 
$.get("get.php", {username:$("#username").val(), password:$("#password").val()}, function(data, textStatus) {//将表单中的数据逐条取出后封装上传
 
$("#target").html(data);//将返回值填充至页面中
 
});
 
});
 
而后有一个简化版,使用serialize()方法序列化
 
代码如下:
 
$("#btn").click(function() {
 
$.get("get.php", $("#form").serialize(), function(data, textStatus) {//将表单中的数据逐条取出后封装上传
 
$("#target").html(data);//将返回值填充至页面中
 
});
 
});
 
serialize()方法可以自动编码,而且除表单之外的如checkbox等对象也可以使用其进行转换
 
同时还有serializeArray()方法可以将元素序列化后返回数组形式的JSON对象,而非JSON字符串
 
即无需使用jQuery.parseJSON()方法进行转换
 
返回值可直接使用类似$.each()等方法进行操作使用
 
 

(编辑:聊城站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章