Question

我正在尝试使用“jq grid”显示数据集。为此，我使用下面的代码，但它只显示没有数据的空行。任何人都可以弄清楚这段代码中有什么问题？

我使用ajax获取数据。所以“响应”将获得这样的数据

{ID:"id1", Message: "Happy Birth Day", Date: "2012-05-24", Time: "14:18:00", status: "pending"}!{ID:"id3", Message: "Happy Birth Day", Date: "2012-05-24", Time: "14:18:00", status: "pending"}

获取数据后，将其拆分并添加到数组中。然后尝试显示它。

这是.JSP文件

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.js"></script>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/sunny/jquery-ui.css" rel="stylesheet" type="text/css" />
  <link rel="stylesheet" type="text/css" media="screen" href="grid/css/ui.jqgrid.css" />
  <script src="grid/js/i18n/grid.locale-en.js" type="text/javascript"></script>
  <script src="grid/js/jquery.jqGrid.min.js" type="text/javascript"></script>
  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <title>Edit Scheduled SMS</title>
  <script type="text/javascript">
    $(function(){ 
        $("#list").jqGrid({
        datatype: "local",
            colNames:['ID','Message', 'Date','Time','status'],
            colModel :[ 
                {name:'ID', index:'ID', width:60}, 
                {name:'Message', index:'Message', width:200}, 
                {name:'Date', index:'Date', width:90, align:'right'}, 
                {name:'Time', index:'Time', width:90, align:'right'}, 
                {name:'status', index:'status', width:80, align:'right'} 
           ],
           pager: '#pager',
           rowNum:10,
           rowList:[10,20,30],
           sortname: 'invid',
           viewrecords: true,
           gridview: true,
           caption: 'Single SMS'
        }); 
        $.ajax({
            type : "GET",
            url : "ScheduledClass",
            data : {
                type : "getSingleScheduledMsg"
            }
        })
        .success(function(response,status){         
            tableResult = response;
            var tableData = [];     
            tableData=tableResult.split("!");   

            for(var i=0;i<tableData.length;i++)
                jQuery("#list").jqGrid('addRowData',i+1,tableData[i]);
        })
        .error(
            function() {//error !!!!!               
        });
    }); 
  </script>
  </head>
  <body>
      <div id="wrapper" style="height: 100%;">
          <div id="content_box" style="width: 600px;">
              <div class="ui-widget">
                  <div class="ui-widget-header">Edit Scheduled SMS</div>
                      <div>
                          <div class="ui-widget-content">
                              <div style="padding: 10px 10px 10px 10px;">
                                  <Form name="EditScheduledSMS" method="post"
                                        id="EditScheduledSMS style="display: inline;">
                                      <table id="list"><tr><td/></tr></table>
                                      <div id="pager"></div> 
      ......//closing tags...........

最后的图片是这样的：

A table without Data

Answer 1

tableData[i]应该是一个以字符串形式出现的对象，如果将子字符串转换为json字符串，可以尝试使用JSON.parse将其更改为对象。
此外，如果您使用ajax填充网格，为什么使用local作为数据类型，如果您指定了url和不同的数据类型，jqgrid已经使用ajax填充网格。

jqgrid没有显示数组数据

1 个答案: