0

我正在尝试使用“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...........

最后的图片是这样的：

没有数据的表

4

1 回答 1

1

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

于 2012-05-18T18:02:23.403 回答