新人使用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"删除。
相关推荐
本篇笔记主要关注jQuery EasyUI的源码解析,特别是与数据操作相关的功能,如批量删除、表单编辑、行选择修改以及自定义编辑器方法。 ### 1. 批量删除 批量删除功能是数据管理中常见的一种操作,jQuery EasyUI提供...
### EasyUI表单提交实例解析 在Web开发中,表单提交是一种常见的与后端交互的方式。使用jQuery插件EasyUI可以简化表单的创建和提交过程。本文将详细介绍如何在EasyUI环境中创建一个表单,并通过实例展示如何提交...
这里的`success`函数会在服务器端脚本处理完表单数据后执行,并接收来自服务器端的数据。`$.messager.alert`方法用于显示一个消息对话框,将服务器返回的信息展示给用户。 ##### 步骤三:服务器端脚本的编写 为了...
在"jQuery EasyUI 扩展(tip和form)"这个主题中,我们将深入探讨如何利用 EasyUI 的扩展功能来优化提示(tip)和表单(form)的交互体验。 首先,让我们谈谈“Tip”。在 Web 开发中,提示信息通常用于向用户提供即时...
jQuery EasyUI 是一个基于 jQuery 的轻量级前端框架,它提供了丰富的组件,如对话框、表单、菜单等,帮助开发者快速构建用户界面。在这个"Jquery-easyUI动态菜单"项目中,我们将会探讨如何在标准的 Maven 项目中实现...
- **EasyUI 组件**: EasyUI 提供了多种 UI 组件,如对话框(dialog)、表单(form)、表格(datagrid)、菜单(menu)等,这些组件都基于 jQuery 设计,可以直接嵌入到网页中,大大提高了开发效率。 ### 2. EasyUI ...
jQuery EasyUI则是一个基于jQuery的前端框架,它提供了丰富的UI组件,如表格、表单、下拉菜单等,使得开发者可以快速构建用户界面。EasyUI通过CSS和JavaScript实现了对HTML元素的美化和交互功能。 在创建CRUD系统时...
在本文中,我们将深入探讨如何将jQuery EasyUI与Struts2框架进行整合,特别是关注属性驱动的方式。jQuery EasyUI是一个基于jQuery的前端UI库,它提供了丰富的组件和易于使用的API,使得开发人员能够快速构建美观的...
最后,JQuery Easyui表单组件的使用还涉及到一些细节处理,例如表单验证的配置、表单提交的回调逻辑、以及表单加载过程中的错误处理等。通过合理的配置和编写相应的JavaScript代码,可以实现对表单进行高级控制,如...
如果验证成功,表单会被提交,`success` 函数将在服务器返回数据后执行,弹出一个警告框显示返回的数据。 总结一下,这个示例展示了如何使用 EasyUI 的 jQuery 插件实现表单验证和提交。主要知识点包括: 1. ...
1. **组件丰富**:jQuery EasyUI 提供了大量的UI组件,如 DataGrid(数据网格)、Form(表单)、Dialog(对话框)、Menu(菜单)、Tree(树形结构)等,这些组件都经过精心设计,易于使用且功能强大。 2. **响应式...
**jQuery EasyUI** 是一个基于 jQuery 的前端框架,它提供了丰富的用户界面组件,使得开发者能够快速构建出美观、交互性强的Web应用。EasyUI 的核心理念是通过简单的 HTML 标签和 CSS 类来实现复杂的 UI 效果,极大...
- `submit`: 执行提交动作,可以传入选项对象,其中包含 `url`、`onSubmit` 和 `success` 等属性。 - `loadData`: 加载记录来填充表单,数据参数可以是URL字符串或者对象类型。 - `clear`: 清除表单数据。 - `...
### jQuery EasyUI 培训文档知识点概览 #### 一、Accordion(手风琴面板) **1.1 概述** Accordion 组件是 jQuery EasyUI 中的一个非常实用的插件,它允许用户轻松地创建可折叠的手风琴面板。这对于节省页面空间...
- `success`: 表单提交成功后执行的回调函数,接收服务器返回的数据作为参数。 **表单插件事件** - `onSubmit`: 提交前触发,无参数,返回 `false` 可阻止提交。 - `success`: 数据提交成功时触发,参数 `data` 为...
EasyUI会自动检测这些数据选项,并在提交表单时执行验证。如果验证失败,输入框边框将变为红色,并显示错误提示。对于多行文本输入,如`message`字段,可以使用`multiline:true`来开启多行模式。 此外,EasyUI还...
jQuery EasyUI 是一款基于 jQuery 的前端框架,它提供了丰富的用户界面组件,如对话框、表单、菜单、树形控件等,大大简化了Web应用程序的开发工作。在这个毕业设计项目中,我们将深入探讨如何利用jQuery EasyUI ...
### 二、EasyUI表单验证 1. **使用validatebox插件**:EasyUI提供了`validatebox`插件,用于对表单字段进行验证。要进行验证,我们需要在输入框上添加`class="easyui-validatebox"`,并使用`required`属性指定字段...
4. `success`: 这是表单提交成功后的回调函数。它接收服务器返回的结果,通常是一个JSON格式的数据。通过`eval('(' + result + ')')`将JSON字符串转换为JavaScript对象。如果操作成功,会显示提示消息,并刷新父窗口...