Question

希望有人能够指出我正确的方向。

我已经浏览过与jqGrid＆amp; amp; json没有填充jqGrid表（一些链接）：

jqGrid - Table not being populated by data from json request

jgGrid not displaying json data

JSON and jqGrid. What is "userdata"?

jqGrid with JSON data renders table as empty

jqGrid not displaying JSON data

但无法找到问题的答案。

基本上我要做的是从日志文件中读取事件列表（带有日期和时间信息）并显示在jqGrid中。

这是我的设置：

[1]我的Servlet片段



@Override
    protected void doGet(HttpServletRequest aRequest,
            HttpServletResponse aResponse, Hashtable aQueryData,
            LocaleData aLocale) throws ServletException, IOException {

        System.out.println("doGet(): Received Request: " + aRequest.getServletPath());

        // jqGrid expects the JSON data in a predefined format:
        //      { 
        //            "total": "xxx", 
        //            "page": "yyy", 
        //            "records": "zzz",
        //            "rows" : [
        //              {"id" :"1", "cell" :["cell11", "cell12", "cell13"]},
        //              {"id" :"2", "cell":["cell21", "cell22", "cell23"]},
        //                ...
        //            ]
        //      }


        // Calling getLogEntries() method populates logEntries & logEntriesCnt.
        // logEntries contains the "rows" data as specified above.
            // For now I am testing with 10 rows of data.
        getLogEntries(aLocale);

        JSONObject jqGridData = new JSONObject();
        jqGridData.put("total", "1");
        jqGridData.put("page", "1");
        jqGridData.put("records", String.valueOf(logEntriesCnt-1));
        jqGridData.put("rows", logEntries);

        System.out.println("\n\n# Event Log Entries (" + new Date() + "):" + (logEntriesCnt-1));
        System.out.println("jqGrid JSON: \n" + jqGridData.toJSONString());

        aRequest.setAttribute("userdata", jqGridData.toJSONString());

        aRequest.getRequestDispatcher("/jsp/eventlogtest.jsp").forward(aRequest, aResponse);
    }

@Override protected void doGet(HttpServletRequest aRequest, HttpServletResponse aResponse, Hashtable aQueryData, LocaleData aLocale) throws ServletException, IOException { System.out.println("doGet(): Received Request: " + aRequest.getServletPath()); // jqGrid expects the JSON data in a predefined format: // { // "total": "xxx", // "page": "yyy", // "records": "zzz", // "rows" : [ // {"id" :"1", "cell" :["cell11", "cell12", "cell13"]}, // {"id" :"2", "cell":["cell21", "cell22", "cell23"]}, // ... // ] // } // Calling getLogEntries() method populates logEntries & logEntriesCnt. // logEntries contains the "rows" data as specified above. // For now I am testing with 10 rows of data. getLogEntries(aLocale); JSONObject jqGridData = new JSONObject(); jqGridData.put("total", "1"); jqGridData.put("page", "1"); jqGridData.put("records", String.valueOf(logEntriesCnt-1)); jqGridData.put("rows", logEntries); System.out.println("\n\n# Event Log Entries (" + new Date() + "):" + (logEntriesCnt-1)); System.out.println("jqGrid JSON: \n" + jqGridData.toJSONString()); aRequest.setAttribute("userdata", jqGridData.toJSONString()); aRequest.getRequestDispatcher("/jsp/eventlogtest.jsp").forward(aRequest, aResponse); }

控制台上的输出（我通过jsonlint验证了它）：

# Event Log Entries (Fri Dec 09 11:02:25 GMT 2011):10
jqGrid JSON: 
{"total":"1","page":"1","records":"10","rows":[{"id":"1","cell":["09\/12\/11","11:01:52","Communication Established"]},{"id":"2","cell":["09\/12\/11","11:01:52","Monitoring Started"]},{"id":"3","cell":["09\/12\/11","10:50:55","Communication Established"]},{"id":"4","cell":["09\/12\/11","10:50:55","Monitoring Started"]},{"id":"5","cell":["09\/12\/11","10:36:57","Communication Established"]},{"id":"6","cell":["09\/12\/11","10:36:57","Monitoring Started"]},{"id":"7","cell":["09\/12\/11","10:30:58","Communication Established"]},{"id":"8","cell":["09\/12\/11","10:30:58","Monitoring Started"]},{"id":"9","cell":["09\/12\/11","10:21:58","Communication Established"]},{"id":"10","cell":["09\/12\/11","10:21:58","Monitoring Started"]}]}

[2]我的JSP

# Event Log Entries (Fri Dec 09 11:02:25 GMT 2011):10 jqGrid JSON: {"total":"1","page":"1","records":"10","rows":[{"id":"1","cell":["09\/12\/11","11:01:52","Communication Established"]},{"id":"2","cell":["09\/12\/11","11:01:52","Monitoring Started"]},{"id":"3","cell":["09\/12\/11","10:50:55","Communication Established"]},{"id":"4","cell":["09\/12\/11","10:50:55","Monitoring Started"]},{"id":"5","cell":["09\/12\/11","10:36:57","Communication Established"]},{"id":"6","cell":["09\/12\/11","10:36:57","Monitoring Started"]},{"id":"7","cell":["09\/12\/11","10:30:58","Communication Established"]},{"id":"8","cell":["09\/12\/11","10:30:58","Monitoring Started"]},{"id":"9","cell":["09\/12\/11","10:21:58","Communication Established"]},{"id":"10","cell":["09\/12\/11","10:21:58","Monitoring Started"]}]}

从我的Javascript中可以看到。我有测试json数据，对应于从服务器发送的json。测试数据没有渲染问题（参见屏幕截图）： http://tinypic.com/r/acrgus/5

我真的不介意能够分页表中的数据。我只想显示数据并每隔5分钟更新一次。一旦我获得要显示的基本数据，我将进行更新。

任何帮助表示赞赏。提前谢谢。

Answer 1

如果您将需要用于填充网格的数据直接放在HTML页面上，则不应使用

<div id="logEntries">
    userdata = ${userdata}
</div>

在HTML正文中。数据

<div id="logEntries">
    userdata = {"total":"1","page":"1",...}
</div>

您的JavaScript代码无法很好地阅读

。而不是你可以在页面的头部包含类似

的内容

<script type="text/javascript">
    var mygriddata = {"total":"1","page":"1",...};
</script>

如果全局变量将被设置（window.mygriddata），并且可以被头部下方放置的其他JavaScript代码使用。顺便说一句，上面的分配是初始化。 JSON数据是 string ，如下所示：

var mygriddata = '{"total":"1","page":"1",...}';

语句var mygriddata = {"total":"1","page":"1",...}直接定义对象而不是字符串。所以你可以按照JavaScript语法和cab重写代码

<script type="text/javascript">
    var mygriddata = {
        total: "1",
        page: "1"//, ...
    };
</script>

现在，您可以使用datatype:'jsonstring'和datastr: mygriddata来填充网格。 datastr的值可以是字符串或对象。如果您想使用JSON而不是对象初始化，则应修改代码以包含' ${userdata}以上的代码：

<div id="logEntries">
    userdata = '${userdata}'
</div>

如果你想使用datatype:'json'并从每个Ajax的servlet获取JSON数据，服务器代码不应该写出正确的服务器响应主体HttpServletResponse，但至少要设置{{1}对Content-Type的响应标头：

application/json

我不使用Java，所以我无法在服务器代码中帮助你。

jqGrid没有填充来自Java Servlet的JSON数据

1 个答案: