ajax完成list无刷新返回

ajax无刷新技术总结,以下是一段我写的ajax应用的js脚本。其中提交的data刚开始我采用的是$('#formId').serialize();但是出现乱码问题,为了解决乱码问题,我就另外写了一个方法解码,

function serilizeJieMa(){
    var params =
$("#formId").serialize(); // http request parameters.
       
params = decodeURIComponent(params,true);
       
params = encodeURI(encodeURI(params));
       
return params;
 }在后台只要解码就可以了;

String productType = new
String(vinCodeImportHalfWhForm.getProductType().getBytes("ISO-8859-1"),
"UTF-8");
  vinCodeImportHalfWhForm.setProductType(java.net.URLDecoder.decode(productType,
"UTF-8"));

$.ajax({
        type:
"POST",
        dataType:"json",

url:"./vinCodeImportHalfWhAddQuery.shtml",

data
: serilizeJieMa(),//解决中文乱码问题
        async:false,

success
: function(msg){
        if(msg=='0'){

ht +="<table align = 'center'
border='0' width='100%' cellspacing='0' cellpadding='0'
>";
           
ht +="<tr  class=
'tb_operate'>";
           
ht +="<td valign='bottom' align = 'center' width
='100%'
height='24'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;";

ht+="<font
color='red'>数据大于20条,请重新查询!</font>";

$("#testDIV").html(ht);
           
return;
        }

if(msg.jsonCount==0){

ht +="<table align = 'center'
border='0' width='100%' cellspacing='0' cellpadding='0'
>";
           
ht +="<tr  class=
'tb_operate'>";
           
ht +="<td valign='bottom' align = 'center' width
='100%'
height='24'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;";

ht+="<font
color='red'>无数据!</font>";

$("#testDIV").html(ht);
           
return;
        }

ht
+= " <table id='zhcx' border='0' cellpadding='0'
align ='center' cellspacing='1' class='tb' width='100%'
>";
         ht
+= "<tr class='tb_operate'
align='center'><td 
width='5%' 
>单选</td>";
         ht
+= "<td  width='5%' nowrap
>&nbsp;&nbsp;车辆型号</td><td 
width='5%' nowrap
>车系名称</td> ";
        $.each(msg.jsonArray,function(i,n){

ht+="<tr
class='tb_operate' align='center'><td
align='center'><input type = 'radio'
class='radiobutton' name = 'iRadio' value
='"+n.configureId+"'/></td>";

ht+="<td>"+n.vehicleModel+"</td>";

ht+="<td>"+n.familyName+"</td>";

ht+="</tr>";

});

ht
+="</table>";
        ht
+="<table align = 'center' border='0' width='100%'
cellspacing='0' cellpadding='0' >";
        ht
+="<tr  class=
'tb_operate'>";
        ht
+="<td valign='bottom' align = 'center' width
='100%'
height='24'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;";

ht
+="<input type = 'button' class='button' name =
'returnBut' title = 'CRTL + Z' tabindex='1' value = '选择完成
(Z)'  onclick = 'javascript:returnValueTo()'
/>";
        $("#testDIV").html(ht);

}

})

}else{
   $("#testDIV").html(ht);
  }
 }

在后台

public String
vinCodeImportHalfWhAddQuery(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) throws
java.lang.Exception {
  StringBuffer json = new
StringBuffer();
  VinCodeImportHalfWhDTO dto =
new VinCodeImportHalfWhDTO();
  VinCodeImportHalfWhForm
vinCodeImportHalfWhForm = (VinCodeImportHalfWhForm) form;
  BeanUtil.copy(dto,
decodeAjaxForm(vinCodeImportHalfWhForm));
  VinCodeImportHalfWhService
vinCodeImportHalfWhService = this.getBean();
  List list =
vinCodeImportHalfWhService.getMapVehicles(dto); //得到车型
  if (null != list
&& list.size() > 0)
{
   if
(list.size() > 20) {
    json.append("0");

} else
{
    json.append("{jsonCount:'"
+ list.size() +
"',jsonArray:[").append(addHistory(list)).append("]}");
   }
  } else {
   json.append("{jsonCount:'0'}");

}
  response.setContentType("text/json;charset=gbk");

response.getWriter().print(json.toString());

return null;

}
其中decodeAjaxForm方法是我写的用于解码的方法,就像上边写的方法一样,哪个字段需要解码就解码哪个字段。这样就完成了ajax无刷新返回list.

ajax完成list无刷新返回的更多相关文章

  1. 本篇文章主要是对jquery+ajax+C#实现无刷新操作数据库数据的简单实例进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助

    我们知道同步执行和异步执行的区别,为了更好的提高用户的体验,我们都会采用异步方式去处理一些问题,毕竟单线程的同步可能回造成卡死等现象,很不友好,所以可以使用ajax来完成用户的体验,现在我们就来说说如 ...

  2. nodejs利用ajax实现网页无刷新上传图片

    nodejs利用ajax实现网页无刷新上传图片 标签(空格分隔): nodejs 通常情况下上传图片是要通过提交form表单来实现的,但是这又不可避免的产生了网页转. 利用ajax技术和FormDat ...

  3. HTTP与AJAX深入揭秘,不使用AJAX实现页面无刷新

    AJAX的原理是什么? 实际上就是发起HTTP请求,既然就是发起HTTP请求,那只要我们能够实现发起HTTP请求就可以在不使用AJAX的情况下实现相同的效果. 在前端有好多方式可以发起HTTP请求,比 ...

  4. Ajax+Asp.Net无刷新分页

    1.新建解决方案,并建立四个项目BLL,DAL,Model,PagerTest,如图所示: 2.Model代码 using System; using System.Collections.Gener ...

  5. ASP.NET Ajax简单的无刷新分页

    最近练习了一些AJAX无刷新分页,写得比较简单,性能不知道怎么样,求大神指点,如有更好的分页提供,欢迎交流! 发话不多说了,直接上代码! 首先从网上下了一个JS分页,感觉挺好用的 (function( ...

  6. Ajax技术(WEB无刷新提交数据)

    (转自:http://www.jb51.net/article/291.htm) Ajax内部交流文档一.使用Ajax的主要原因 1.通过适当的Ajax应用达到更好的用户体验: 2.把以前的一些服务器 ...

  7. TP2.0或3.1 或者 3.2 下使用ajax+php做无刷新分页(转+自创)

    1.前言 作为一名php程序员,我们开发网站主要就是为了客户从客户端进行体验,在这里,thinkphp框架自带的分页类是每次翻页都要刷新一下整个页面,这种翻页的用户体验显然是不太理想的,我们希望每次翻 ...

  8. jquery+ajax(用ajax.dll)实现无刷新分页

    利用ajax.dll那种方式的无刷新,在这就不说了,新朋友可以看下我的另一片文件http://www.cnblogs.com/dachuang/p/3654632.html 首先,这里用的是jquer ...

  9. jQuery+AJAX实现网页无刷新上传

    新年礼,提供简单.易套用的 jQuery AJAX上传示例及代码下载.后台对文件的上传及检查,以 C#/.NET Handler 处理 (可视需要改写成 Java 或 PHP). 有时做一个网站项目 ...

随机推荐

  1. 《JavaScript 闯关记》之初探

    当学习一门新的编程语言的时候,应该边学边做,反复演练以加深理解.因此,你需要一个 JavaScript 解释器.幸运的是,每一个 Web 浏览器都包含一个 JavaScript 解释器. 可以通过在 ...

  2. Equal 和==比较

    Equal 和==比较 ==操作符专门用来比较两个变量的值是否相等,也就是用于比较变量所对应的内存中所存储的数值是否相同,要比较两个基本类型的数据或两个引用变量是否相当,只能用==操作符. 如果一个变 ...

  3. ASP.NET程序代码优化的七个方面

     ASP.NET程序性能优化的七个方面      一.数据库操作 1.用完马上关闭数据库连接 访问数据库资源需要创建连接.打开连接和关闭连接几个操作.这些过程需要多次与数据库交换信息以通过身份验证,比 ...

  4. C++中socket编程

    原文:http://blog.csdn.net/cuiran/article/details/5854794 Server端 #include <WINSOCK2.H> #include ...

  5. C/S ASP.NET页面传值汇总

    一. QueryString是一种非常简单的传值方式,他可以将传送的值显示在浏览器的地址栏中.如果是传递一个或多个安全性要求不高或是结构简单的数值时,可以使用这个方法.但是对于传递数组或对象的话,就不 ...

  6. Hibernate工作原理及为什么要用?(转http://www.cnblogs.com/javaNewegg/archive/2011/08/28/2156521.html)

    原理:1.通过Configuration().configure();读取并解析hibernate.cfg.xml配置文件2.由hibernate.cfg.xml中的<mapping resou ...

  7. Char型和string型字符串比较整理

    1.赋值 char赋值: char ch1[] = "give me"; char ch2[] = "a cup"; strcpy(ch1,ch2); cout ...

  8. 浏览器加载模式:window.onload和$(document).ready()的区别(详解)

    jQuery库文件是在body元素之前加载的,必须等待所有的DOM元素加载后,延迟支持DOM操作,否则就无法获取到. 在延迟等待加载,JavaScript提供了一个事件为load,方法如下: wind ...

  9. LINUX用户管理——/etc/passwd文件详解

      输入vi /etc/passwd 可以查看此文件的内容 .本机内容如下: [root@localhost ~]# vi /etc/passwdroot:x:0:0:root:/root:/bin/ ...

  10. static wechat red package tool

    ---------------------------------------------------------------------------------------------------- ...