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. css控制父元素下的子元素自适应高度,且高度一致

    css代码: .wrap{width:600px;margin:0 auto; overflow:hidden;} .left{background:#ccc;width:300px;float:le ...

  2. css系列教程--css文件的创建

    css文件的创建:1.外部样式表:<link rel="stylesheet" type="text/css" href="mystyle.cs ...

  3. UITableView的分割线不满屏的解决方法

    #pragma -mark 以下2个方法,解决分割线不满屏问题 -(void)viewDidLayoutSubviews { if ([tableView respondsToSelector:@se ...

  4. 5.7 cm server-agent 会出现无法启动

    异常信息如下: 离线安装cloudera-scm-agent5.7的Unable to create the pidfile问题 在离线安装Cloudera Manager启动agent出现了如下异常 ...

  5. 二.ubuntu14.04 3D特效设置

    一.如果按照第一篇都设置好了(显卡驱动等都已经正常),然后 1.安装CCSM设置管理器 用鼠标点击屏幕左侧Unity程序启动栏中的“Ubuntu软件中心”(有“A”字形的公文包图标), 在弹出的“Ub ...

  6. jupyter巨好玩-简介与安装

    ipython notebook改名jupyter了而且更好玩更好用 jupyter简介 jupyter是啥啊? 这个要从ipython说起,ipython是个交互式的python的解释器,自带颜色, ...

  7. PNPOLY - Point Inclusion in Polygon W. Randolph Franklin

    测试目标点是否在多边形内int pnpoly(int nvert, float *vertx, float *verty, float testx, float testy) { int i, j, ...

  8. 管道通信之无名管道---pipe()

    pipe()函数在子进程产生之前就应该存在. 父子进程之间只进行一次传递 /*============================================ > Copyright ( ...

  9. 倒计时 NAN 问题

    http://blog.csdn.net/lishangua/article/details/51506821

  10. C语言的本质(1)——计算机与二进制

    人类的计数方式通常是"逢十进一",称为十进制(Decimal),大概因为人有十个手指,所以十进制是最自然的计数方式,各民族的文字中都有十个数字,而阿拉伯数字0-9是目前最广泛采用的 ...