Столкнулся с проблемой, которую никак не могу решить. Действительно, у меня есть 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>
Функция обновления моей диаграммы немного сложна, поэтому я поместил ее в другой блок, поскольку не думаю, что это источник проблемы, потому что повторная визуализация должна произойти до завершения:
<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)
- console.log внутри моего блока outputpanel НЕ отображается. Тогда я думаю, что есть проблема с повторным рендерингом. Плюс отображение console.log IS при загрузке страницы, поэтому я не думаю, что здесь есть какая-то проблема с кодом...
Более того, не возникает ошибка JS. Тогда я действительно не понимаю, почему ререндер не хочет работать.
Есть идеи, что здесь происходит?
Спасибо, ребята :)
