javascript - 如何将 hashmap 值从 java 文件传递​​到 Javascript

标签 javascript java html hashmap xmlhttprequest

我正在尝试使用 Java 文件从数据库检索值并将其存储到 HashMap。请找到以下代码(Sample.java):

import java.sql.*;
import java.util.HashMap;

public class Sample {

 static Connection conn;
 static PreparedStatement stmt;
 static ResultSet rs;
 String sql;
 static String project="Project1";
 public static HashMap< String, String> map = new HashMap< String, String>();
public static void main(String[] args) {

    try{  

        Class.forName("com.mysql.jdbc.Driver");
        conn=DriverManager.getConnection("jdbc:mysql://localhost:3309/graphvalue","root","root");
        stmt=conn.prepareStatement("select * from TestCase where ProjectName= ?");
        stmt.setString(1,project);
        rs=stmt.executeQuery();
        while(rs.next())
        {
            System.out.println(rs.getString(1)+"  "+rs.getInt(2)+"  "+rs.getInt(3)+" "+rs.getInt(4)+" "+rs.getInt(5));
        map.put("ProjectName", rs.getString(1));
        map.put("Total TestCase", String.valueOf(rs.getInt(2)));
        map.put("TestCase Executed", String.valueOf(rs.getInt(3)));
        map.put("Failed TestCase", String.valueOf(rs.getInt(4)));
        map.put("TestCase Not Executed", String.valueOf(rs.getInt(5)));
        System.out.println("ProjectName  "+map.get("ProjectName"));

        }
        conn.close();
        }
    catch(Exception e)
        { System.out.println(e);}
}

}

请找到我从数据库检索的以下数据:

ProjectName TotalTestCase TestCaseExecuted TestCaseFailed TestCaseNotExecuted    
 Project1       50              30              8                20

我想将此值传递给 Javascript,以便我能够使用这些值绘制图表。请在下面找到我的 HTML/Javascript 代码 (test.html):

<html>
<head>
</head>
<body>
<select id="ChartType" name="ChartType" onchange="drawChart()">
<option value = "PieChart">Select Chart Type
 <option value="PieChart">PieChart
 <option value="Histogram">Histogram
 <option value="LineChart">LineChart
 <option value="BarChart">BarChart
</select>
<div id="chart_div" style="border: solid 2px #000000;"></div>
<p id="demo"></p>
<p id="demo1"></p>

<script type="text/javascript" src="https://www.google.com/jsapi"></script>

<script type="text/javascript">
var row = [];
var temp;
var stri;
google.load('visualization', '1.0', {'packages':['corechart']});
google.setOnLoadCallback(getValues);
     function getValues() {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        stri = xmlhttp.responseText;
            drawChart();
        }
    };
    xmlhttp.open("GET", "sample.java", true);
    xmlhttp.send();
    }

    function drawChart() {
    var data = new google.visualization.DataTable();
    str = stri.split(",");

        // How to call the value from java file so that I will be able to draw the below graph by passing the value.

    data.addRows(row);
    var a = document.getElementById("ChartType").value;
    document.getElementById("demo1").innerHTML = "You selected: " + a;
    var options = {'title':'How Much Pizza I Ate Last Night',
                   'width':400,
                   'height':300
                   };
    var chart = new google.visualization[document.getElementById("ChartType").value](document.getElementById('chart_div'));
    chart.draw(data, options);
    }
</script>
</body>
</html>

请告诉我如何继续或是否有人有任何其他示例。请与我分享。谢谢

最佳答案

  1. 您可以 convert your map to JSON 。而不是这个 HelloWorld 类,您可以将其转换为返回此 `JSON

    的服务
    import java.sql.*;
    import java.util.HashMap;
    
    public class Sample {
        static Connection conn;
        static PreparedStatement stmt;
        static ResultSet rs;
        String sql;
        static String project = "Project1";
        public static HashMap < String, String > map = new HashMap < String, String > ();
    
        //Notice how your main class is now converted into a service
        public static String getProjects() {
    
            try {
    
                Class.forName("com.mysql.jdbc.Driver");
                conn = DriverManager.getConnection("jdbc:mysql://localhost:3309/graphvalue", "root", "root");
                stmt = conn.prepareStatement("select * from TestCase where ProjectName= ?");
                stmt.setString(1, project);
                rs = stmt.executeQuery();
                while (rs.next()) {
                    System.out.println(rs.getString(1) + "  " + rs.getInt(2) + "  " + rs.getInt(3) + " " + rs.getInt(4) + " " +
                        rs.getInt(5));
                    map.put("ProjectName", rs.getString(1));
                    map.put("Total TestCase", String.valueOf(rs.getInt(2)));
                    map.put("TestCase Executed", String.valueOf(rs.getInt(3)));
                    map.put("Failed TestCase", String.valueOf(rs.getInt(4)));
                    map.put("TestCase Not Executed", String.valueOf(rs.getInt(5)));
                    System.out.println("ProjectName  " + map.get("ProjectName"));
    
                    /*______________ NEW CODE ______________*/
                    JSONObject resultMap = new JSONObject(map);
                    return resultMap.toString();
                }
    
            } catch (Exception e) {
                System.out.println(e);
            } finally {
                conn.close();
            }
            return "";
        }
    
    }
    
  2. 现在将您的 test.html 转换为 test.jsp 并调用该服务 我们在上一步中创建并输出结果 JSON 到 JavaScript 变量中。

    测试.jsp

    <%@page import="com.path.to.Sample"%>
    <html>
        <head>
            <script>
                <!-- call that service and output that json into a javascript variable -->
                var resultantJSON = <%= Sample.getProjects() %>
    
                <!-- Now all that's left is to parse that json  -->
                var projects = JSON.parse(resultantJSON);
    
            </script>
        </head>
        <body>
            ...
            ...
        </body>
    </html>
    

    现在,从数据库获取的所有结果都位于 Test.jspprojects 变量中。您可以像在 jsp 文件中使用传统 javascript 对象一样使用它们。

关于javascript - 如何将 hashmap 值从 java 文件传递​​到 Javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39287195/

相关文章:

javascript - 不使用 run() 编写 gulpfile.js

java - 如何在eclipse中为java代码添加快捷键

java - 是否可以启动嵌入在我的 spring-boot 应用程序中的 Axon 服务器?

php - 将单独的 HTML 和 PHP MYSQL 表单合并到一个文件中

javascript - html注入(inject)中的jQuery脚本执行顺序

javascript - 挖空绑定(bind)文本框以选择文本

javascript - 如何将 jQuery 添加到 VuePress 文件中

如果重新加载页面,JavaScript 将忽略警报

java - session 超时回调

html - 具有内联 block 子项的 div 与相同的 CSS 显示不一致