Google Charts Table未显示(Servlet & JSP)



我正在将数据从MYSQL数据库提取到beanList,并使用来自servlet的请求转发数据。

String test = json.toJson(tableList);
request.setAttribute("tableList",test);
request.getRequestDispatcher("NewFile.jsp").forward(request, response);

在我的JSP中,我有以下代码

    <%-- <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>--%>
    <%@page import="com.data.object.MainData"%>
    <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
      pageEncoding="ISO-8859-1"%>
     <html>
     <head>
     <script type="text/javascript" src="https://www.google.com/jsapi">  </script>
<script type="text/javascript">
  google.load("visualization", "1", {packages:["table"]});
google.setOnLoadCallback(drawChart);

  function drawChart() {
    //var jsonData = ${tableList};
     var    data = new google.visualization.DataTable(${tableList});
   var table = new google.visualization.Table(document.getElementById('table_div'));
      table.draw(data, {showRowNumber: true});
  }

</script>
  </head>
  <body>
   <div id="table_div"></div>
   </body>
  </html>

我已经测试并获得了正确的 json 数据,但无法打印/显示表格......

火虫中的输出(净值 -> 全部)显示

HeadersResponseHTMLCacheCookies

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load("visualization", "1", {packages:["table"]});
  google.setOnLoadCallback(drawChart);
function drawChart() {
 //         var jsonData = [
{
     "FormCtrlValId": 107,
     "FormCtrlValLabel": "abcc.",
 "FormCtrlValCode": "90",
 "FormCtrlValCityId": 18,
"FormCtrlValofCtrlId": 1226,
"FormCtrlId": 1226,
"FormCtrlLabel": "Location Code",
"FormCtrlType": "EditText",
"FormCtrlIsFixed": false,
"FormCtrlHasCodes": true,
"FormId": 335,
"CtrlOrderNum": 1,
"RecordDetailId": 1233,
"RecordDetailLongitude": 23,
"RecordDetailLatitude": 2234,
"RecordingTimeStamp": "Jan 15, 2015 4:05:22 AM",
"SubmissionTimeStamp": "Jan 15, 2015 4:05:35 AM",
"ServerTimeStamp": "Jan 15, 2015 9:05:36 AM",
"RecordDetailOfFormId": 2,
"RecordDetailOfCityId": 1,
"RecordDetailByUserId": 1,
"FormDetailId": 2,
"FormDetailName": "some form 123",
"FormLastUpdatedOn": "Jan 23, 2015 1:48:20 PM",
"FormDetailLastUpdatedByUserId": 4,
"FormDetailCreatedByUserId": 4,
"FormSubCat": 4,
"FormArchived": false,
"RecordId": 0,
"ControlId": 26,
"ControlValue": "90",
"RegionCityId": 8,
"RegionCityName": "some city",
"RegionId": 2,
"Location": "some location ",
"Status": "some status"
 },

需要一些帮助。

看起来

您在drawChart函数中缺少很多必需的代码。看看下面。我删除了很多显示的数据以保持示例较小,但我想你会明白的。

<!DOCTYPE html>
<html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type='text/javascript' src="https://www.google.com/jsapi"></script>
    <script type='text/javascript'>
        google.load("visualization", "1", {packages:["table"]});
        google.setOnLoadCallback(drawChart);
        function drawChart() {
            var data = new google.visualization.DataTable();
            data.addColumn('number', 'Value 1');
            data.addColumn('string', 'Value 2');
            data.addColumn('string', 'Value 3');
            //Your data, trimmed for this example.
            data.addRows([
                [107,'abcc.','90']    
             ]);
            var table = new google.visualization.Table(document.getElementById('table_div'));
            table.draw(data, {showRowNumber: true});    
        }
    </script>
    </head>
    <body>
        <div id="table_div"></div>
    </body>
</html>

最新更新