Question

。大家好！

我使用在页面加载时从Java方法检索的JSON数据编码geochart：

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

google.load('visualization', '1', {'packages':['corechart','geochart','table']}, {"callback" : drawMapStates});
google.setOnLoadCallback(drawMapStates);

function drawMapStates() {
    var dataStates = new google.visualization.DataTable();
    var scoreStates = #{managerialDashboardMB.scoreStatesJson};
    console.log(scoreStates);
    // etc
    geoChartStates = new google.visualization.GeoChart(document.getElementById('pnl-row-1-col-1-chart'));
    geoChartStates.draw(dataStates, options);
}

此页面中的每个组件都相应地更新数据，因为p:dataTable使用正确的值进行更新，但JavaScript内容保持不变 - 在更糟糕之前：它们过去只是消失了。

例如，这个按钮：

<p:selectOneMenu id="states" disabled="#{empty managerialDashboardMB.states}" value="#{managerialDashboardMB.state.id}" styleClass="oneMenu client_#{managerialDashboardMB.clientId}" filter="true" filterMatchMode="contains">
    <f:selectItem itemValue="0" itemLabel="- Select -" />
    <f:selectItems value="#{managerialDashboardMB.getStatesByCountryId(1)}" var="state" itemLabel="#{state.name}" itemValue="#{state.id}" />
    <p:ajax event="change" listener="#{managerialDashboardMB.onChange('states')}" />
</p:selectOneMenu>

它的Ajax监听器方法调用另一个名为drawMaps：

的方法

statesScores = new ArrayList<>();
statesNames = new ArrayList<>();

if (state != null) {
    if (state.getId() == null) {
        statesNames.add("Acre");
        statesNames.add("Alagoas");
        statesNames.add("Amapá");
        // etc
    } else {
        State s1 = stateSB.findById(state.getId());
        statesNames.add(s1.getNome());
    }
}

if (statesNames != null && statesNames.isEmpty() == false) {
    statesNames.parallelStream().forEach((name) -> {
        State s2 = stateSB.findByName(name);
        if (e2 != null) {
            Number valueNumber = geoChartSB.fromResultByClientState("AVG", "integer_value", "state", CLIENT_ID, s2.getId());
            double valueDouble = valueNumber.doubleValue();
            int valueInt = valueNumber.intValue();
            int valueShort = valueNumber.shortValue();
            Number value = valueInt;
            if (value.doubleValue() > 0.0) {
                scoreStates.add(new StringNumber(name, value));
            }
        }
    });
}

Gson gson = new Gson();
scoreStatesJson = gson.toJson(statesScores);
MESSAGES.info(scoreStatesJson);
LOG.info(scoreStatesJson);

然后，执行该方法后：

RequestContext rc = RequestContext.getCurrentInstance();
Collection<String> ids = new ArrayList<>();
ids.add(":table");
ids.add("cities");
ids.add(":formMessages:messages");
ids.add(":layoutCenter:pnlCenter"); // the charts are inside this div
rc.update(ids);
rc.execute("drawMapStates()");
rc.execute("resizeComponentsFrom('layoutCenter')");

JS控制台始终显示初始数据。只有WildFly显示正确的JSON。

尝试在document.ready内构建图表，页面根本没有加载。试图不更新＆＃34;：layoutCenter：pnlCenter＆＃34;并没有任何改变。

Answer 1

通过围绕javascript解决：

<div jsf:id="javascript"></div>

在组件中：

update=":table cidades :formMessages:messages :javascript" oncomplete="drawMapaEstados()"

必须删除使用RequestContext的行，但丢失了编程更新。

以编程方式使用JSF 2.2 / PrimeFaces 5.1中的AJAX从Google Charts更新图表

1 个答案: