How do I pass a Java bean list to JavaScript?

[bobt Thompson]

How do you pass a server-side bean value or list of values to JavaScript in a <script> block?

So, I have this simple Java bean:

public class DataBean {
    private double xpt;
    private double ypt;

    public double getXpt()
    {
        return xpt;
    }
    public void setXpt(double xpt)
    {
        this.xpt = xpt;
    }
    public double getYpt()
    {
        return ypt;
    }
    public void setYpt(double ypt)
    {
        this.ypt = ypt;
    }
}

In my servlet application I create a list of these things.

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
{
    // For the sake of simplicity I'll just create two points using the formula f(x) = x*2.
    List<DataBean> list = new ArrayList<>();
    for (int i = 0; i < 2; i++) {
        DataBean dat = new DataBean();
        dat.setXpt((double)i);
        dat.setYpt(i*2.0);
        list.add(dat);
    }
    // Now I have a list of data points that I want to somehow "render" in my JavaScript page.
    request.setAttribute("datapoints", list);
    request.getRequestDispatcher("/ShowFile.jsp").forward(request, response);
}

Now in the JavaScript I want to plot them.  For simplicity in this example I'll just log them.

   <script>
   var datapoints = ${requestScope.datapoints}
   
   // Now can this thing be referenced as if it were the Java type "class DataBean"?
   for (var dat : datapoints) {
       // This probably won't work ??
       var x = dat.xpt
       var y = dat.ypt
       console.log("x = " + x + ", y = " + y)
   }
   </script>

In my final code I'll want to plot those points on a canvas using SVG.  My aim is to write a simple web program to upload plot
files and display plots.  But I have no idea how to reference Java class types from JavaScript.

[Bear Bibeault]

Remember that all JSP does is to "write" the HTML document to then send to the client (refresher: this article).

So, to make your data available to the JS on the page, you need to recreate the data there. There's no direct passing of the data.

An alternative (which I'm not advocating at this time), is to obtain the data via an Ajax call, where you would pass the data as a JSON construct.

[Tim Holloway]

JavaScript and Java are not related. Java beans only exist within a Java VM (on the host, since applets are DOA), JavaScript is typically running on the client (since there's no JVM for server-side JavaScript).

However, there are mechanisms for serializing JavaBeans for JavaScript to consume - just marshall the bean out to JSON (Javascript Object Notation). JavaScript can easily consume JSON data and convert it to JavaScript equivalent data structures. Likewise, JavaScript scan write out JSON and send it to a server for a Java backend to parse into POJOs.

In fact, that's the heart of how you get data back and forth in AJAX. Although other formats also work (like SOAP and YAML), JSON is the most JavaScript-friendly encoding mechanism, And I believe that there's currently JSON libraries built into the stock JVM. Or if not, several alternatve third-party libraries.