// Visualize: Change table column conditional formatting (5.6) // This Fiddle uses a non-standard demo Object: // sales_fact_ALL.sales_fact_ALL__store_sales_2013 visualize({ auth: { name: "superuser", password: "superuser" } }, function (v) { //discover name through JRXML (field name by default) var salesColumnName = "sales_fact_ALL.sales_fact_ALL__store_sales_2013", report = v.report({ resource: "/public/Samples/Reports/04._Product_Results_by_Store_Type_Report", container: "#container", error: showError }); $("#changeConditions").on("click", function() { report.updateComponent(salesColumnName, { conditions: [ { operator: "greater", value: 10, backgroundColor: null, font: { color: "FF0000", bold: true, underline: true, italic: true } }, { operator: "between", value: [5, 9], backgroundColor: "00FF00", font: { color: "0000FF" } } ] }) .then(printConditions) .fail(showError); }); function printConditions(component){ console.log("Conditions: "+ component.conditions); } function showError(err) { alert(err); } });
<!-- Visualize: Change table column conditional formatting (5.6) --> <script type='text/javascript' src="http://code.jquery.com/jquery-2.1.0.js"></script> <script type='text/javascript' src="http://underscorejs.org/underscore-min.js"></script> <script type='text/javascript' src="http://localhost:8080/jasperserver-pro/client/visualize.js"></script> <button id="changeConditions">Change conditions for numeric column</button> <div id="container"></div>