`

jQuery EasyUI From表单提交后不执行success

 
阅读更多

新人使用EasyUI的From表单实现文件上功能,后台处理成功后返回json串,但返到了页面上显示我的json数据串,而没有走到success,代码如下:

$(function() {
	$('#importFile').click(function() {
		$.messager.progress(); // 显示一个进度条
		$('#activityUserFileUpload').form('submit', {
			url : basePath + '/activity?methodName=importActivityFile',
			onSubmit : function() {
				var isValid = $(this).form('validate');
				if (isValid) {
					$.messager.progress({
						text : "正在导入,请稍后..."
					});
					return true;
				}
				return false;// 未通过表单验证阻止表单提交
			},
			success : function(data) {
				$.messager.progress('close'); // 当成功提交之后隐藏进度条

				// alert(data);
				console.log(data);
			}
		});
	});
});

 找了很久没有找到原因,后来发现提交了两次表单,如下图:



 

 为什么是两次提交呢想不明白,所以尝试着把上面代码当中的"submit"删除,再次尝试就正常了,如下图:



 

把上图中红色选择的删除就可以,不知道有没有人也遇到此问题。解决方法是不是一样。

 

问题原因:

问找到了,现在前来看一下我页面上的代码如下图:

<form id="activityUserFileUpload" action="" method="post" enctype="multipart/form-data">
	<input type="file" class="easyui-validatebox" validType="validateFile" required="true" name="file" style="width:150px;"/>
	<input id="importFile" type="submit" name="import" value="导入用户"/>
	<a href="${application.getContextPath()}/tempFile/Template.xlsx">下载模板</a><br/></a>
    </form>

 可以看到我导入用户按钮使用了"submit"来处发事件,所以我们可以看到是两次请求。所以要解决问题有两个方法了,要么你提交时不用"submit"提交,如果你使用了"submit"提交他就得像我上面那样把js当中的"submit"删除。

  • 大小: 129.9 KB
  • 大小: 132.5 KB
  • 大小: 177.6 KB
分享到:
评论

相关推荐

    JQueryEasyUI学习笔记(十)源码

    本篇笔记主要关注jQuery EasyUI的源码解析,特别是与数据操作相关的功能,如批量删除、表单编辑、行选择修改以及自定义编辑器方法。 ### 1. 批量删除 批量删除功能是数据管理中常见的一种操作,jQuery EasyUI提供...

    jquery插件EasyUI中form表单提交实例分享

    ### EasyUI表单提交实例解析 在Web开发中,表单提交是一种常见的与后端交互的方式。使用jQuery插件EasyUI可以简化表单的创建和提交过程。本文将详细介绍如何在EasyUI环境中创建一个表单,并通过实例展示如何提交...

    jQuery EasyUI官方详细图文指导教程

    这里的`success`函数会在服务器端脚本处理完表单数据后执行,并接收来自服务器端的数据。`$.messager.alert`方法用于显示一个消息对话框,将服务器返回的信息展示给用户。 ##### 步骤三:服务器端脚本的编写 为了...

    jQuery EasyUI 扩展(tip和form)

    在"jQuery EasyUI 扩展(tip和form)"这个主题中,我们将深入探讨如何利用 EasyUI 的扩展功能来优化提示(tip)和表单(form)的交互体验。 首先,让我们谈谈“Tip”。在 Web 开发中,提示信息通常用于向用户提供即时...

    Jquery-easyUI动态菜单

    jQuery EasyUI 是一个基于 jQuery 的轻量级前端框架,它提供了丰富的组件,如对话框、表单、菜单等,帮助开发者快速构建用户界面。在这个"Jquery-easyUI动态菜单"项目中,我们将会探讨如何在标准的 Maven 项目中实现...

    jquery-easyui

    - **EasyUI 组件**: EasyUI 提供了多种 UI 组件,如对话框(dialog)、表单(form)、表格(datagrid)、菜单(menu)等,这些组件都基于 jQuery 设计,可以直接嵌入到网页中,大大提高了开发效率。 ### 2. EasyUI ...

    使用Struts2和jQuery EasyUI实现简单CRUD系统

    jQuery EasyUI则是一个基于jQuery的前端框架,它提供了丰富的UI组件,如表格、表单、下拉菜单等,使得开发者可以快速构建用户界面。EasyUI通过CSS和JavaScript实现了对HTML元素的美化和交互功能。 在创建CRUD系统时...

    jQuery EasyUI与Struts2 的整合—属性驱动篇

    在本文中,我们将深入探讨如何将jQuery EasyUI与Struts2框架进行整合,特别是关注属性驱动的方式。jQuery EasyUI是一个基于jQuery的前端UI库,它提供了丰富的组件和易于使用的API,使得开发人员能够快速构建美观的...

    Jquery Easyui表单组件Form使用详解(30)

    最后,JQuery Easyui表单组件的使用还涉及到一些细节处理,例如表单验证的配置、表单提交的回调逻辑、以及表单加载过程中的错误处理等。通过合理的配置和编写相应的JavaScript代码,可以实现对表单进行高级控制,如...

    Jquery插件easyUi表单验证提交(示例代码)

    如果验证成功,表单会被提交,`success` 函数将在服务器返回数据后执行,弹出一个警告框显示返回的数据。 总结一下,这个示例展示了如何使用 EasyUI 的 jQuery 插件实现表单验证和提交。主要知识点包括: 1. ...

    jquery-easyui, jquery-easyui lib , update form http.zip

    1. **组件丰富**:jQuery EasyUI 提供了大量的UI组件,如 DataGrid(数据网格)、Form(表单)、Dialog(对话框)、Menu(菜单)、Tree(树形结构)等,这些组件都经过精心设计,易于使用且功能强大。 2. **响应式...

    JqueryeasyUi

    **jQuery EasyUI** 是一个基于 jQuery 的前端框架,它提供了丰富的用户界面组件,使得开发者能够快速构建出美观、交互性强的Web应用。EasyUI 的核心理念是通过简单的 HTML 标签和 CSS 类来实现复杂的 UI 效果,极大...

    jQuery EasyUI API 中文文档 - Form表单

    - `submit`: 执行提交动作,可以传入选项对象,其中包含 `url`、`onSubmit` 和 `success` 等属性。 - `loadData`: 加载记录来填充表单,数据参数可以是URL字符串或者对象类型。 - `clear`: 清除表单数据。 - `...

    jQueryEasyUi培训文档.pdf

    ### jQuery EasyUI 培训文档知识点概览 #### 一、Accordion(手风琴面板) **1.1 概述** Accordion 组件是 jQuery EasyUI 中的一个非常实用的插件,它允许用户轻松地创建可折叠的手风琴面板。这对于节省页面空间...

    jQuery EasyUI API 中文文档 – Form表单

    - `success`: 表单提交成功后执行的回调函数,接收服务器返回的数据作为参数。 **表单插件事件** - `onSubmit`: 提交前触发,无参数,返回 `false` 可阻止提交。 - `success`: 数据提交成功时触发,参数 `data` 为...

    Jquery组件easyUi实现表单验证示例

    EasyUI会自动检测这些数据选项,并在提交表单时执行验证。如果验证失败,输入框边框将变为红色,并显示错误提示。对于多行文本输入,如`message`字段,可以使用`multiline:true`来开启多行模式。 此外,EasyUI还...

    jquery_easyUI项目完整版(毕业设计)

    jQuery EasyUI 是一款基于 jQuery 的前端框架,它提供了丰富的用户界面组件,如对话框、表单、菜单、树形控件等,大大简化了Web应用程序的开发工作。在这个毕业设计项目中,我们将深入探讨如何利用jQuery EasyUI ...

    轻松学习jQuery插件EasyUI EasyUI表单验证

    ### 二、EasyUI表单验证 1. **使用validatebox插件**:EasyUI提供了`validatebox`插件,用于对表单字段进行验证。要进行验证,我们需要在输入框上添加`class="easyui-validatebox"`,并使用`required`属性指定字段...

    EasyUI中实现form表单提交的示例分享

    4. `success`: 这是表单提交成功后的回调函数。它接收服务器返回的结果,通常是一个JSON格式的数据。通过`eval('(' + result + ')')`将JSON字符串转换为JavaScript对象。如果操作成功,会显示提示消息,并刷新父窗口...

Global site tag (gtag.js) - Google Analytics