Question

为什么不会填充网格？

我使用java动态生成JSON字符串。（主要.java） [json字符串生成的gif图像] [1]

  package com.queryData.main;

  import com.queryData.dao.DataDAO;
  import com.queryData.services.JsonServices;
  import java.sql.ResultSet;
  import java.util.List;
  import org.json.JSONObject;

  public class Main {
    ResultSet resultSet = null;
    DataDAO datadao = new DataDAO();

    public List<JSONObject> getJsonObject() {
        resultSet = datadao.getResultSet();
        List<JSONObject> resList = JsonServices.getFormattedResult(resultSet);
        return resList;
    }

    public static void main(String[] args) {
        Main m = new Main();
        List<JSONObject> jObj = m.getJsonObject();
        for (int i = 0; i < jObj.size(); i++) {
            System.out.println(jObj.get(i));
        }
    }
}

我有paramQuery网格加载但是dataModel有加载数据的问题。（index.xhtml） [没有数据的网格加载的gif图像] [2]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head>
    <!--jQuery dependencies-->
    <link rel="stylesheet"
        href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css" />
    <script
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script
        src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
    <!--ParamQuery Grid files-->
    <h:outputStylesheet name="css/pqgrid.min.css" />
    <h:outputScript name="js/pqgrid.min.js" />
        <!--Include Touch Punch file to provide support for touch devices-->    
    <h:outputScript name="js/jquery.ui.touch-punch.js" />   
<script>
$(function(){
    var obj = {};
    obj.width = 700;
    obj.height = 400;    
    obj.colModel = [
        { title: "Person ID", width:100, dataIndx: "person_id"},
        { title: "Full Name", width:200, dataIndx: "fullname"},
        { title: "First Name", width:150, dataIndx: "firstname"},
        { title: "Last Name", width:150, dataIndx: "lastname"}
        ];    
    <!-- reference to load remote data -->    
    var dataModel = {
            recIndx: "personid",
            location: "remote",
            sorting: "local",
            paging: "local",
            dataType: "JSON",
            method: "GET",
            sortIndx: "lastname",
            sortDir: "up",            
            url: "main.java"
            , getData: function (dataJSON) {
                var data = dataJSON.data;
                return { data: dataJSON.data };
            }
        }    
    <!-- KEY PART TO LOAD DATA -->       
    $("div#grid_array").pqGrid( obj );
}); 
</script>
</h:head>
<h:body>
    <div id="grid_array"></div>    
</h:body>
</html>

我更改了网址，但不知道应该如何编写网址引用，下面是我目前正在尝试更正的脚本

    <h:head>
    <!--jQuery dependencies-->
    <link rel="stylesheet"
        href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css" />
    <script
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script
        src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
    <!--ParamQuery Grid files-->
    <h:outputStylesheet name="css/pqgrid.min.css" />
    <h:outputScript name="js/pqgrid.min.js" />
        <!--Include Touch Punch file to provide support for touch devices-->    
    <h:outputScript name="js/jquery.ui.touch-punch.js" />

<script>
$(function()
{
<!-- reference to load remote data --> 
    var dataModel =
        {
            location: "remote",   
            sorting: "local",                     
            dataType: "JSON",
            method: "GET",
            url: "json",
            getData: function (dataJSON) {return { data: dataJSON.data };}    
        }   
<!-- reference to create column titles -->
    var obj = {dataModel:dataModel};    
    obj.colModel = 
        [
        { title: "Person ID", width:100, dataIndx: "person_id"},
        { title: "Full Name", width:200, dataIndx: "fullname"},
        { title: "First Name", width:150, dataIndx: "firstname"},
        { title: "Last Name", width:150, dataIndx: "lastname"}
        ];
<!-- reference to initiate the request -->      
    $("div#grid_array").pqGrid( obj );
}
); 
</script>

</h:head>
<h:body>
    <div id="grid_array"></div>    
</h:body>

这两个生成JSON字符串的servlet，我需要从LIST修改为字符串，以此格式生成JSON数据。

{＆＃34; data＆＃34;：[row1，row2，..]}

并可通过我的VIEW索引中的GET HTTP请求通过URL检索。 XHTML

两个bean和一个索引VIEW：

第一个豆 -

    package com.queryData.services;

import java.sql.ResultSet;
import java.sql.ResultSetMetaData;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;
import org.json.JSONObject;

public class JsonServices {
    public static List<JSONObject> getFormattedResult(ResultSet rs) {
        // List<JSONObject> resList = new ArrayList<JSONObject>();      
        List<JSONObject> resList = "{\"data\":" + new ArrayList<JSONObject>() + "}";
        // above is the attempt to modify   

        try {
            // get column names
            ResultSetMetaData rsMeta = rs.getMetaData();
            int columnCnt = rsMeta.getColumnCount();
            List<String> columnNames = new ArrayList<String>();
            // loop to get all column names
            for (int i = 1; i <= columnCnt; i++) {
                // adding all retrieved column names to List object
                columnNames.add(rsMeta.getColumnName(i).toUpperCase());
            }
            while (rs.next()) {
                // convert each object to an human readable JSON object
                JSONObject obj = new JSONObject();
                for (int i = 1; i <= columnCnt; i++) {
                    String key = columnNames.get(i - 1);
                    String value = rs.getString(i);
                    obj.put(key, value);
                }
                resList.add(obj);
            }
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            try {
                rs.close();
            } catch (SQLException e) {
                e.printStackTrace();
            }
        }
        return resList;
    }
}

第二个豆 -

    package com.queryData.main;

import com.queryData.dao.DataDAO;
import com.queryData.services.JsonServices;
import java.sql.ResultSet;
import java.util.List;
import org.json.JSONObject;

public class Main {
    ResultSet resultSet = null;
    DataDAO datadao = new DataDAO();

    public List<JSONObject> getJsonObject() {
        resultSet = datadao.getResultSet();
        List<JSONObject> resList = JsonServices.getFormattedResult(resultSet);
        return resList;
    }

    public static void main(String[] args) {
        Main m = new Main();
        List<JSONObject> jObj = m.getJsonObject();
        for (int i = 0; i < jObj.size(); i++) {
            System.out.println(jObj.get(i));
        }
    }
}

查看索引。 XHTML

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:c="http://java.sun.com/jsp/jstl/core">

<h:head>
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"/>
    <h:outputStylesheet name="css/pqgrid.min.css"/>
    <h:outputScript name="js/pqgrid.min.js"/>           
    <h:outputScript name="js/jquery.ui.touch-punch.js"/>
<script>
$(function(){
    var obj = {};
    obj.width = 700;
    obj.height = 400;    
    obj.colModel = [
        { title: "Person ID", width:100, dataIndx: "person_id"},
        { title: "Full Name", width:200, dataIndx: "fullname"},
        { title: "First Name", width:150, dataIndx: "firstname"},
        { title: "Last Name", width:150, dataIndx: "lastname"}
        ];
    var dataModel = {
            recIndx: "personid",
            location: "remote",
            sorting: "local",
            paging: "local",
            dataType: "JSON",
            method: "GET",
            sortIndx: "lastname",
            sortDir: "up",            
            url: "main"
            , getData: function (dataJSON) {
                var data = dataJSON.data;
                return { data: dataJSON.data };
            }
        }
    $("div#grid_array").pqGrid( obj );
}); 
</script>   
</h:head>
<h:body>
<div id="grid_array"></div>  
</h:body>
</html>

可以在deployed test run

查看已部署的测试应用

Answer 1

您可以执行以下操作：

创建支持bean

Persons.java

@ManagedBean(name="persons")
@SessionScoped
public class Persons {
  ResultSet resultSet = null;
  DataDAO datadao = new DataDAO();
  public List<JSONObject> people = JsonServices.getFormattedResult(datadao.getResultSet());
  /** getter and setter **/
}

在你的xhtml中，你添加了一个隐藏元素，你可以在其中放置来自支持bean的数据

<h:inputHidden id="hiddenPeople" value="#{persons.people}" />

在你的xhtml，javascript部分

<script>
  $(function() {
     var peopleList = $('#hiddenPeople');
     var peopleJson = JSON.parse(peopleList)
     // display peopleJson
  });
</script>

现在，我不确定List人员是否会转换为字符串，因此您可能希望将其转换为String而不是List。

dataModel URL javascript函数不填充网格

1 个答案: