`
y806839048
  • 浏览: 1106770 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

form ajax提交返回html直接嵌入

    博客分类:
  • form
 
阅读更多

form 提交

1,返回的跳转页面可以直接赋值给页面的一个变量(比如ajax的设置返回格式html即可)这样对于逻辑复杂的展现效果非常好,一套逻辑

2,也可以字节流的方式写入标签中的src等 属性

3, ajax拼接时间过长,有异步渲染问题

一个页面

 

1 直接action submit提交

2 ajax提交

  A, 默认返回式string,(json)

 function submit() {

if (confirm('确实要绑定吗?')) {

form.submit();

return true;

}

return false;

}

  B, 当要求返回式html时dataType:"html",

  html形式提交,返回直接是页面嵌入

 

   function loadData(){

//alert($("#search").formSerialize());

$.ajax({

url:"getAccountData",

type:"post",

dataType:"html",

cache:false,

data:$("#search").formSerialize(),//url传参形式,&&&

success:function(data){

$("#data").html(data);//这个返回的是一个跳转的jsp页面,直接嵌入

},

error:function(retMsg){

try{

var ret = eval("("+retMsg.responseText+")");

if(ret.status!=0){

$.zd.alert('',ret.msg);

}

}catch(eee){

}

}

});

 

 

<div id="data">

     

      </div>

 

这个时候后台不必写@Response()标签,这个标签针对的是json格式的数据返回

@RequestMapping(value = "/getAccountData")

public String getAccountData(Model model,TbCusUserBeanVo tbCusUserBeanVo, HttpServletRequest request, HttpSession session) throws Exception {

 

Map<String,Object> param = new HashMap<String,Object>();

CASUtil.getCurrentUserName(request, session);

param.put("CUSTOMER_KEY", customerKey);

param.put("MAN", tbCusUserBeanVo.getMan());

param.put("CUS_USER_ID", tbCusUserBeanVo.getCusUserId().toUpperCase());

param.put("CUS_USER_STATUS", tbCusUserBeanVo.getCusUserStatus());

model.addAttribute("list",accountService.getOperateUserByCustomerKey(param));

return "myaccount/operateUser/operateUserListData";

}

分享到:
评论

相关推荐

    Laravel-Bootstrap-Modal-Form, 使用AJAX提交模式中的Bootstrap 表单,使用 Laravel 验证.zip

    Laravel-Bootstrap-Modal-Form, 使用AJAX提交模式中的Bootstrap 表单,使用 Laravel 验证 Laravel-Bootstrap-Modal-Form你的Laravel 应用程序的表单验证扩展插件。 在将 Bootstrap 窗体嵌入到 Bootstrap/jquery模式...

    JavaScript将base64图片转换成formData并通过AJAX提交的实现方法

    成功上传后,服务器会返回数据,通过AJAX的`success`回调函数处理服务器返回的结果。 整个过程不需要修改服务器端代码,通过前端JavaScript将base64图片转换为标准的formData格式,并利用AJAX提交,就可以实现图片...

    HTML 页面直接调用 php 文件的方法

    HTML页面可以直接通过`&lt;form&gt;`标签提交表单到PHP文件进行处理。例如: ```html &lt;form action="process.php" method="post"&gt; &lt;/form&gt; ``` 这里,当用户点击“Submit”按钮时,浏览器会向`process.php`发送...

    股票代码(可嵌入到网页中)

    综上所述,实现“股票代码(可嵌入到网页中)”的功能,需要掌握HTML、JavaScript、Ajax技术,并理解如何与服务器进行数据交互。同时,选择合适的股票数据API并正确处理返回的数据也是关键。这样的功能提高了用户...

    juery+ajax常用js文件

    2. **jQuery Form Plugin**: `jquery.form.js` 是一个jQuery插件,专门处理表单提交,特别是异步提交(即Ajax提交)。这个插件支持文件上传,允许用户在不刷新页面的情况下发送表单数据,极大地提升了用户体验。它还...

    ajax和JSP实现文件上传

    2. **Ajax调用**:当用户选择文件并提交表单时,使用JavaScript的XMLHttpRequest对象或者更现代的Fetch API发送Ajax请求。在Ajax请求中,我们将文件数据以FormData对象的形式附加上去,这样可以通过HTTP的POST方法...

    JSP_模拟AJAX实现无刷新文件上传

    IFRAME相当于在一个页面内嵌入了一个小型的独立网页,我们可以在IFRAME中提交表单,实现文件上传。当用户选择文件后,表单提交到IFRAME指向的URL,服务器处理文件上传请求,然后将结果返回给IFRAME。由于IFRAME是...

    ajax iframe上传.

    而`iframe`(Inline Frame)则是一种HTML元素,用于在当前文档中嵌入另一个文档。结合两者,AJAX与iframe可以实现异步文件上传,这种方法特别适用于处理大文件或需要在上传过程中显示进度的场景。下面将详细介绍这一...

    JSP+Ajax实例演示

    &lt;form id="ajaxForm"&gt; 用户名" /&gt; 提交 &lt;/form&gt; ``` 2. **JavaScript**: 使用jQuery的`$.ajax`方法发送请求,验证用户名是否已存在: ```javascript $("#ajaxForm").submit(function(event) { event....

    AJAX基础教程-5 Ajax Validate

    这种验证方式提供了更好的用户体验,因为错误信息可以即时显示,而无需等待整个表单提交后服务器返回结果。 **一、Ajax基础** Ajax是Web开发中的一个技术组合,它允许部分网页更新,而无需重新加载整个页面。这通过...

    EXT制作的FORM,可以与Servlet进行交互

    EXT form支持使用`Ext.Ajax`类来进行AJAX提交。当用户填写完表单并点击提交按钮时,可以通过`form.submit()`方法将数据异步发送到服务器。在提交过程中,我们可以设置URL(对应Servlet的URL),以及成功和失败的回...

    kindeditor-form-editor

    在实际应用中,"kindeditor-form-editor"可能需要与其他前端框架或后端服务配合,例如,使用Ajax技术将表单数据提交到服务器,或者与jQuery、Vue、React等库集成,以实现更复杂的应用场景。此外,为了保证用户体验,...

    PHP+jQuery ajax无刷新上传图片 带上传进度条

    - PHP(Hypertext Preprocessor)是一种广泛使用的开源服务器端脚本语言,特别适合于Web开发,可以嵌入到HTML中。 - jQuery是一个快速、简洁的JavaScript库,使得JavaScript编程变得更加简单,它简化了HTML文档遍历...

    ajax+php验证用户名是否注册

    **PHP** 是一种广泛使用的服务器端脚本语言,尤其适用于Web开发,可以嵌入到HTML中。在用户名验证过程中,PHP将处理Ajax发送过来的请求,查询数据库以确认用户名是否已被注册。 以下是实现这一功能的主要步骤: 1....

    AJAX+JSP实现基于WEB的文件上传的进度控制

    它将Java代码嵌入HTML或XML中,服务器端编译为Servlet执行,然后返回给客户端。JSP页面可以包含静态内容、脚本元素、指令和动作,提供了一种灵活的方式来生成动态内容。 三、文件上传原理 在AJAX+JSP实现文件上传时...

    JSP实现WEB版AJAX聊天功能.rar

    HTML代码应包括一个`&lt;form&gt;`元素用于提交消息,以及一个`&lt;div&gt;`元素用于展示聊天历史。 3. **AJAX原理** AJAX的核心是XMLHttpRequest对象,它在后台与服务器进行通信,而无需刷新整个页面。在JavaScript中,我们...

    web-form-portlet.rar_portlet_web form

    4. 表单提交:可以使用AJAX异步提交,或者传统的HTTP POST方法提交表单数据。 三、Portlet Web Form开发 在Portlet中实现Web表单,需要结合portlet的生命周期和API来处理表单的显示、提交和处理。以下是一些关键...

    Form表单提交刷新页面不跳转源码设计

    这种用户体验被称为"无刷新提交"或"AJAX提交",在现代Web开发中非常流行。 需要注意的是,为了实现表单提交不跳转的效果,我们需要确保表单中的`action`属性为空或指向当前页面,同时利用iframe作为提交目标。如果...

    JSP AJAX 无刷新表单验证

    **JSP AJAX 无刷新表单验证** 在Web开发中,用户交互体验是至关...通过前端发送AJAX请求,后端进行验证并返回结果,使得表单验证过程更加流畅。理解并掌握这一技术,对于提升Web应用的质量和用户体验具有重要意义。

Global site tag (gtag.js) - Google Analytics