`
xiangqian0505
  • 浏览: 322641 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js处理ajax返回的json对象循环创建到表格

    博客分类:
  • java
阅读更多
//注:LO是表格的id; 需要自己创建表头, n行,9列的表格;
var tab_id;
function varify(cardinno) {
tab_id=document.getElementById("Layer1");
displayDiv();
tab_id.style.display="none";
var url="getRefInfoServlet?cardInNo="+cardinno;
var myAjax=new Ajax.Request(url,{method:'post', parameters:'0', onSuccess:doOnComplete, asynchronous:true});
}
var doOnComplete=function(xml_httpRequest){
var msg=eval(xml_httpRequest.responseText);
var info=msg.length;
var row;
var col;
if(info>0)
{
for(var i=0;i<info;i++){
row = L0.insertRow(L0.rows.length);
row.insertCell(0).innerHTML ="&nbsp;"+msg[i].a;
row.insertCell(1).innerHTML ="&nbsp;"+msg[i].b;
row.insertCell(2).innerHTML ="&nbsp;"+msg[i].c;
row.insertCell(3).innerHTML ="&nbsp;"+msg[i].d;
row.insertCell(4).innerHTML ="&nbsp;"+msg[i].e;
row.insertCell(5).innerHTML ="&nbsp;"+msg[i].f;
row.insertCell(6).innerHTML ="&nbsp;"+msg[i].g;
row.insertCell(7).innerHTML ="&nbsp;"+msg[i].h;
row.insertCell(8).innerHTML ="&nbsp;"+msg[i].i;
row.setAttribute("align", "center");
}

tab_id.style.display="block";
}else{
tab_id.innerHTML="<center>抱歉,该卡未开通,获取不到租还车信息!</center>";
tab_id.style.width = "80%";
    tab_id.style.position = "absolute";//绝对位置显示
tab_id.style.display="block";
}
removeDiv();
}
//遮罩层显示
displayDiv=function()
{
   var  mybg = document.createElement("div");
    mybg.setAttribute("id","mybg");
    mybg.innerHTML="<center>正在处理中, 请稍候<img src='lib/images/loading.gif'></img></center>";
    mybg.style.width = "100%";
    mybg.style.position = "absolute";//绝对位置显示
    mybg.style.top = "260";
    mybg.style.left = "0";
    mybg.style.zIndex = "100";//z轴位置
    mybg.style.opacity = "0.8";//透明度
    mybg.style.filter = "Alpha(opacity=80)";//滤镜显示透明度
    document.body.appendChild(mybg);
}
//遮罩层移除
removeDiv=function()
{
document.body.removeChild(mybg);
}



//java后台存入json对象
/**
* 根据卡内码得到最近的租还车记录
* 返回json对象
* @param cardInNo
* @return
*/
public String getRefInfo(String cardInNo)
{
StringBuffer bf=new StringBuffer(1024);
bf.append("");//sql语句
System.out.println(bf.toString());
/************ 存储json对象***************/
List<JSONObject> jsonList=new ArrayList<JSONObject>();
        try {
        /****************获得判断信息存入数组中*******************/
    String [][] str=getArrayByName(bf.toString());
    if(str!=null){
        for (int i = 0; i < str[0].length; i++) {
        JSONObject returnValue =new JSONObject();
        returnValue.put("a", str[0][i])
        .put("b", str[1][i])
        .put("c", str[2][i].trim().equals("")?"":str[2][i].substring(0, 19))
        .put("d", str[3][i].trim().equals("")?"":str[3][i].substring(0, 19))
        .put("e", str[4][i])
        .put("f", str[5][i])
        .put("g", str[6][i])
        .put("h", str[7][i])
        .put("i", str[8][i]);
       
        jsonList.add(returnValue);
}
    }
}catch (Exception e) {
e.printStackTrace();
}
System.out.println(jsonList.toString());
return jsonList.toString();
}
分享到:
评论

相关推荐

    js+ajax处理java后台返回的json对象循环创建到表格的方法.docx

    ### JS + AJAX 处理 Java 后台返回的 JSON 对象循环创建到表格的方法 在 Web 开发中,前后端分离已经成为一种趋势,其中 AJAX(Asynchronous JavaScript and XML)技术被广泛应用于实现前后端的数据交互。本文将...

    js+ajax处理java后台返回的json对象循环创建到表格的方法

    本实例将详细讲解如何利用JS和Ajax处理Java后台返回的JSON对象,并将其循环创建到HTML表格中。 首先,我们需要了解几个关键概念: 1. **Ajax**:一种创建动态网页的技术,允许在不重新加载整个页面的情况下,与...

    ajax获得json对象数组 循环输出数据的方法

    总结来说,本文介绍了如何使用AJAX获取JSON对象数组,并通过jQuery的`$.ajax`和`$.each`方法来循环遍历数据,将结果输出到HTML表格中。在实际应用中,可以根据需要调整数据处理逻辑,比如进行更复杂的数据转换或渲染...

    如何将ajax请求返回的Json格式数据循环输出成table形式

    本问题主要探讨如何使用Ajax请求获取Json格式的数据,并将其循环输出到HTML表格(table)中。这里我们将详细介绍整个流程,包括Ajax请求、Json数据处理以及HTML元素的动态构建。 首先,Ajax是Asynchronous ...

    ajax 静态网页操作表格分页哦

    4. 更新表格:使用JavaScript或jQuery等库解析返回的数据(通常是JSON),并动态插入到表格中。 5. 分页控制:创建分页按钮,监听点击事件,根据用户选择的页码重新发送Ajax请求。 四、示例代码 ```javascript ...

    浅析ajax请求json数据并用js解析(示例分析)

    4. 客户端解析JSON数据:当客户端通过AJAX接收到服务器返回的JSON数据后,客户端JavaScript代码需要解析这些数据。在示例中,使用了jQuery的$.ajax方法发起请求,并在请求成功返回时通过success回调函数处理数据。...

    Ajax返回的json遍历取值并显示到前台的方法

    在Web开发中,Ajax(Asynchronous JavaScript and XML)是一种创建动态网页的技术,它允许页面在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。在本篇内容中,我们将详细探讨如何利用Ajax获取JSON...

    jQuery JSON动态获取表格数据特效源码.zip

    总的来说,“jQuery JSON动态获取表格数据特效源码.zip”包含了一个完整的流程,从获取JSON数据,解析数据,创建表格,到实现动态加载和视觉特效。这个源码对于学习和理解如何在实际项目中使用jQuery和JSON处理数据...

    jQuery JSON动态获取表格数据代码

    这里,`$.getJSON`函数用于异步加载JSON文件,`forEach`循环遍历JSON数据并创建表格行。双击事件绑定到每行,实现了双击时折叠行的效果。另外,添加一个按钮`全部折叠/展开&lt;/button&gt;`,并绑定点击事件,实现对所有行...

    jQuery+json实现动态创建复杂表格table的方法

    在获取到JSON对象之后,接下来就是利用这个对象的数据动态创建表格。这里需要说明的是,复杂表格通常指的是表格中存在跨行和跨列的情况。 1. 创建表格行和单元格 创建表格行和单元格的基本方法是使用`&lt;tr&gt;`和`&lt;td&gt;...

    json嵌套list

    例如,你可以使用`org.json.JSONObject`和`org.json.JSONArray`类来创建嵌套结构,或者如果你的返回类型是Java对象,Struts2会自动将其转换为JSON。 ```java import org.json.JSONArray; import org.json....

    Ajax遍历jSon后对每一条数据进行相应的修改和删除(代码分享)

    在Web开发中,Ajax(Asynchronous JavaScript and XML)是一种创建动态网页的技术,它允许在不刷新整个页面的情况下与服务器交换数据并更新部分网页内容。在这个示例中,我们看到一个典型的Ajax请求用于从服务器获取...

    ajax 的post方法实例(带循环)

    最后,对于JSON数据的处理,AJAX的`dataType`设置为'json',服务器返回的JSON数据会自动转换为JavaScript对象。然后在`success`回调中,可以遍历这个对象并将其显示在表格中。例如,如果有以下JSON数据: ```json ...

    易语言页面订单json解析

    在IT行业中,JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,广泛应用于网络通信与数据存储。它以其简洁明了的结构,易于人类阅读和编写,同时也方便机器解析和生成。本话题主要涉及使用易语言进行...

    JavaScript和ExtJS及Ajax基础教程

    JavaScript的基础包括变量、数据类型、控制结构(如if语句、for循环)、函数、对象等。 ExtJS是一个基于JavaScript的开源框架,主要用于构建富客户端Web应用程序。它提供了丰富的组件库,如表格、表单、菜单、工具...

    js-表格显示特效

    8. **数据处理**:如果表格数据来自服务器,需要了解AJAX或Fetch API进行异步请求,获取并处理JSON或其他格式的数据。 综上所述,"js-表格显示特效"涵盖了JavaScript编程、DOM操作、CSS样式设计以及可能的第三方库...

    jQuery通过ajax请求php遍历json数组到table中的代码(推荐)

    5. 使用$.each()进行数据迭代:$.each()方法可以遍历对象或数组的属性,用于在循环中处理每个元素。 6. 异常处理:通过在AJAX请求中定义error回调函数来处理网络请求错误。 通过掌握上述知识点,读者可以学会如何...

Global site tag (gtag.js) - Google Analytics