1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > 利用ajaxSubmit()实现Form表单submit()提交后的回调函数

利用ajaxSubmit()实现Form表单submit()提交后的回调函数

时间:2023-08-02 01:33:23

相关推荐

利用ajaxSubmit()实现Form表单submit()提交后的回调函数

1、引入JQuery Form表单的js

<script type="text/javascript" src="${ctxStatic}/common/jquery.form.js"></script>

下载链接:jquery.form.js 密码:fqr9

2.设置相应的参数

$(function(){// 1.基本参数设置 var options = { type: 'POST', // 设置表单提交方式url: "${ctx}/jinzhu/dtUser/save", // 设置表单提交URL,默认为表单Form上action的路径dataType: 'json', // 返回数据类型beforeSubmit: function(formData, jqForm, option){ // 表单提交之前的回调函数,一般用户表单验证// formData: 数组对象,提交表单时,Form插件会以Ajax方式自动提交这些数据,格式Json数组,形如[{name:userName, value:admin},{name:passWord, value:123}]// jqForm: jQuery对象,,封装了表单的元素 // options: options对象var str = $.param(formData); // name=admin&passWord=123var dom = jqForm[0]; // 将jqForm转换为DOM对象var name = dom.name.value; // 访问jqForm的DOM元素/* 表单提交前的操作 */return true; // 只要不返回false,表单都会提交 },success: function(responseText, statusText, xhr, $form){ // 成功后的回调函数(返回数据由responseText获得)if (responseText.status == '1') {alert("操作成功!" + responseText.msg);/* 成功后的操作 */} else {alert("操作失败!" + responseText.msg); // 成功访问地址,并成功返回数据,由于不符合业务逻辑的失败}}, error: function(xhr, status, err) { alert("操作失败!"); // 访问地址失败,或发生异常没有正常返回},clearForm: true, // 成功提交后,清除表单填写内容resetForm: true // 成功提交后,重置表单填写内容}; // 2.绑定ajaxSubmit()$("#inputForm").submit(function(){// 提交表单的id$(this).ajaxSubmit(options); return false; //防止表单自动提交});});

3、项目中使用--示例(基于Jeeplus)

var validateForm;function doSubmit(){//回调函数,在编辑和保存动作时,供openDialog调用提交表单。 if(validateForm.form()){$("#inputForm").submit();return true;} return false;}$(document).ready(function() {validateForm = $("#inputForm").validate();});$(function(){var options = { type: 'POST',success:showResponse, dataType: 'json',error : function(xhr, status, err) {alert("操作失败");}}; $("#inputForm").submit(function(){ $(this).ajaxSubmit(options); return false; //防止表单自动提交});});function showResponse(responseText, statusText, xhr, $form){ if (responseText.success == true) {parent.layer.msg(responseText.msg, {icon:6});} else {parent.layer.msg(responseText.msg, {icon:5});}}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。