我遇到了一个我无法解决的问题。确实,我有带有 apex 变量的 JS,我想重新渲染这个块以获取新的值。我正在使用输出面板,但不幸的是没有发生重新渲染。我的代码如下
<apex:commandButton value="button" id="theButton" action="{!setDataSet}" oncomplete="refreshMyChart()" rerender="jstorerender"/>
<apex:outputpanel id="jstorerender">
<script type="text/javascript" >
$j = jQuery.noConflict();
var innerVar = '{!innerString}';
var covVar = '{!coverageAsCategorie}';
console.log("want to refreshINIT"+innerVar+covVar);
</script>
</apex:outputpanel>
刷新我的图表功能有点复杂,所以我把它放在另一个块中,因为我认为这不是问题的根源,因为重新渲染应该发生在 oncomplete 之前:
<script type="text/javascript">
function refreshMyChart(){
console.log("want to refreshINIT2"+innerVar+covVar);
var chart;
var colors = Highcharts.getOptions().colors;
var categories = ['{!coverageAsCategorie}'];
var name = 'Browser brands';
var data = ['{!innerString}'];
function setChart(options) {
chart.series[0].remove(false);
chart.addSeries({
type: options.type,
name: options.name,
data: options.data,
color: options.color || 'white'
}, false);
chart.xAxis[0].setCategories(options.categories, false);
chart.redraw();
};
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
inverted:true
},
title: {
text: 'Browser market share, April, 2011'
},
subtitle: {
text: 'Click the columns to view versions. Click again to view brands.'
},
xAxis: {
categories: categories
},
yAxis: {
title: {
text: 'Total percent market share'
}
},
plotOptions: {
series: {
cursor: 'pointer',
point: {
events: {
click: function() {
var drilldown = this.drilldown;
var options;
if (drilldown) { // drill down
options = {
'name': drilldown.name,
'categories': drilldown.categories,
'data': drilldown.data,
'color': drilldown.color,
'type': 'columnrange',
};
} else { // restore
options = {
'name': name,
'categories': categories,
'data': data,
'type': 'pie'
};
}
setChart(options);
}
}
},
dataLabels: {
enabled: true,
color: colors[0],
style: {
fontWeight: 'bold'
},
formatter: function() {
return this.y +'%';
}
}
}
},
tooltip: {
formatter: function() {
var point = this.point,
s = this.x +':<b>'+ this.y +'% market share</b><br/>';
if (point.drilldown) {
s += 'Click to view '+ point.category +' versions';
} else {
s += 'Click to return to browser brands';
}
return s;
}
},
series: [{
type: 'pie',
name: name,
data: data,
color: 'white'
}],
exporting: {
enabled: false
}
});
};</script>
无论如何,当我点击我的按钮时会发生什么?:
- 我的刷新函数里面的console.log出现了(然后我猜oncomplete事件已经被触发了)
- 我的 outputpanel 块中的 console.log 不显示。然后我认为重新渲染存在问题。加上页面加载时 console.log IS 显示所以我认为这里的代码没有任何问题......
而且没有触发JS错误。然后我真的不知道为什么重新渲染不想操作。
知道这里会发生什么吗?
谢谢大家:)