Visualize: Render report with pagination
Test plugins
HTML
<script src="http://code.jquery.com/jquery-2.1.0.js"></script>
<script type='text/javascript' src="http://build-master.jaspersoft.com:5980/jrs-pro-trunk/client/visualize.js"></script>
<div id="container"></div>
JavaScript
visualize({
auth: {
name: "superuser",
password: "superuser"
}
}, function (v) {
var $select = buildControl("Chart types: ", v.report.chart.types),
report = v.report({
resource: "/public/Samples/Reports/01._Geographic_Results_by_Segment_Report",
container: "#container",
success: selectDefaultChartType
});
console.log($select);
//Підписка на подію "change" елемента select
$select.on("change", function () {
// this вказує на HTML елемент select
// $(this).val() повертає value вибраної опції селекта, детальніше тут http://api.jquery.com/val/
console.log(this);
var selectedValue = $(this).val();
console.log("Selected chart type is: " + selectedValue);
//чарт ререндериться з типом який був вибраний
report.updateComponent({
chartType: selectedValue
}).fail(function (error) {
alert(error);
});
});
//функція для вибору типу чарта в селекті, такого самого який є по дефолту в чарті
function selectDefaultChartType(data) {
//data - об'єкт, що містить totalPages(загальна кількість сторінок), components(масив компонентів) і links
console.log(data);
//так як data.components - це масив компонентів, а у нас такий компонент лише 1, то вибираємо 0 елемент
// масива, який і буде нашим чартом
var component = data.components[0];
//якшо component не є якимосб falsy значенням (наприклад null або undefined), то умова виконується
if (component) {
// у component є властивість chartType, яка містить у собі тип чарта у вигляді строки
console.log(component.chartType);
// тож ми у jQuery об'єкті $select ми шукаємо опцію value якої співпадає з типом чарта і ставимо для // її атрибута "selected" значення рівне "selected", це означає, що тепер ця опція буде вибраною, детальніше...