如何将 JSF Bean 数据传递给 JavaScript 函数？

Question

我正在使用以下代码传递数据：

<p:poll interval="3" listener="#{chartController.loadChartData}" oncomplete="renderChart('container','area','Sample Chart', '#{chartController.chartData}', '#{chartController.categories}');" 
                      id="chartvalue_btn" update="textID" />

但是当我检查了在 JavaScript 函数中传递了 null 值时，我检查了用值初始化的 bean 变量。我在这里做错了吗？ 我的豆子是

package com.bchetty.charts.controller;

import com.bchetty.charts.model.Series;
import com.google.gson.Gson;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.bean.ViewScoped;

/**
 * Chart Controller
 */
@ManagedBean(name="chartController")
@SessionScoped
public class ChartController {
    private String chartData;
    private String categories;
    private List<String> categoryList = new ArrayList<String>();
    private List<Long> heapSizeList = new ArrayList<Long>();
    private List<Long> usedHeapSizeList = new ArrayList<Long>();
    SimpleDateFormat sdfDate = new SimpleDateFormat("HH:mm:ss");//dd/MM/yyyy
    private static final long MB = 1024*1024;
    int index = 0;
    private Long[] longs;

    /**
     * Load Chart Data
     */
    public void loadChartData() {
        if(heapSizeList.size() > 10) {
            heapSizeList.remove(0);
            usedHeapSizeList.remove(0);
            categoryList.remove(0);
        }
        List<Series> series = new ArrayList<Series>();

        malloc();
        long heapSize = Runtime.getRuntime().maxMemory();
        heapSizeList.add(heapSize/MB);
        usedHeapSizeList.add((heapSize - Runtime.getRuntime().freeMemory())/MB);

        series.add(new Series("Heap Size", heapSizeList));
        series.add(new Series("Used Heap", usedHeapSizeList));

        setChartData(new Gson().toJson(series));

        categoryList.add(sdfDate.format(new Date()));
        System.out.println(categoryList);

        setCategories(new Gson().toJson(categoryList));
    }

    /**
     * @return the chartData
     */
    public String getChartData() {
        return chartData;
    }

    /**
     * @param chartData the chartData to set
     */
    public void setChartData(String chartData) {
        this.chartData = chartData;
    }

    /**
     * @return the categories
     */
    public String getCategories() {
        return categories;
    }

    /**
     * @param categories the categories to set
     */
    public void setCategories(String categories) {
        this.categories = categories;
    }

    private void malloc() {
        if(index%2 == 0) {
            longs = new Long[100000];
            for(int i=0;i<1000;i++) {
                longs[i] = Long.valueOf(i);
            }
        } else {
            longs = null;
        }
        index++;
    }
}

Answer 1

问题是oncomplete-函数的参数只有在进入视图时才会更新。当 bean 上的属性值发生更改时，参数不会自动更新。所以chartController.chartData最初没有被实例化，当页面被渲染时它是null，并且在你手动刷新整个页面之前保持null。

要解决此问题，我建议您使用Primefaces RequestContext 并在每次调用loadChartData 作为回调参数时添加chartData。 IE。将以下内容添加到 loadChartData 的 and 中：

public void loadChartData() {
    ...
    RequestContext context = RequestContext.getCurrentInstance();
    context.addCallbackParam("chartData", chartData);
    context.addCallbackParam("categories", categories);
}

在 UI 中定义 p:poll 如下：

<p:poll interval="3" listener="#{chartController.loadChartData}"
    oncomplete="renderChart('container','area','Sample Chart', args.chartData, args.categories);"
    id="chartvalue_btn" update="textID" />

如果这不适合您，因为您在其他任何地方使用loadChartData，请将loadChartData 的调用与addCallbackParam 内容包装在另一个方法中，并将此方法指定为p:poll 的侦听器。