Visualize.js Cascading Input control

Cascading input control using Fancytree

by Sherman Wood

HTML

<link rel="stylesheet" href="https://rawgithub.com/mar10/fancytree/master/src/skin-win8/ui.fancytree.css">
<script src="https://rawgithub.com/sgwood63/VisualizeSamples/master/js/visualizeCascadingTree.js"></script>
<script src="http://localhost:8080/jasperserver-pro/client/visualize.js"></script>
<script src="http://underscorejs.org/underscore-min.js"></script>
<script src="https://rawgit.com/mar10/fancytree/master/dist/jquery.fancytree-all.min.js"></script>
<table>
<tr>
  <td valign="top"><button id="Run">Run</button><p/><div id="tree"></div></td>
  <td valign="top"><div id="container">-</div></td>
</tr>
</table>

JavaScript

var reportUri = "/public/Samples/Reports/Cascading_Report_2_Updated";
var report;
var visualizeObj;

var product_hierarchy = "Product_Family";

visualize({
    auth: {
        name: "jasperadmin",
        password: "jasperadmin",
        organization: "organization_1"
    }

}, function (v) {
		visualizeObj = v;

		// new VisualizeCascadingTree(visualizeObj, '#tree', top input control name of hierarchy, reportUri, nodeInitializationFunction, bootstrap, treeOptions)
		productTree = new VisualizeCascadingTree(visualizeObj, '#tree', product_hierarchy, reportUri);

		// default rendering of report
		report = visualizeObj.report({
            resource: reportUri,
            container: "#container",
            params: {
                "Product_Family": ["All"],
                "Product_Department": ["All"],
                "Product_Category": ["All"],
                "Product_Name": ["All"]
            },
						error: function(err) {
                alert(err.message);
                console.log(err);
            }
        });
    }, function(err){
		// handle all initialization and authentication errors here
        alert(err.message);
		console.log(err);
 	});

$("#Run").click(function(){
	var params = productTree.getSelectedAsParamsArray();
	report.params(params).run();
});