Visualize: Render Adhoc View

Test plugins

by Yuriy Bablyukh

HTML

<script type='text/javascript' src="http://localhost:8080/jasperserver-pro/client/visualize.js?userLocale=en"></script>

<table>
<tr>
  <td><div id="container"></div></td>
   <td><div id="filters"></div>
   <button id="applyFilter">
  Apply
</button></td>
</tr>
</table>

CSS

#container {
  height: 400px;
  width: 700px;
}

#filters {
  width: 200px;
}

JavaScript

visualize({
  auth: {
    name: "superuser",
    password: "superuser"
  }
}, function(v) {
  var ahv = v.adhocView({
    resource: "/public/AdHoc_View_With_Detail_and_Totals",
    container: "#container",
    success: function() {
      console.log("rendered");
    },
    error: function(e) {
      console.log(e);
    }
  });

  var controls = v.inputControls({
    container: "#filters",
    resource: "/public/AdHoc_View_With_Detail_and_Totals",
    success: function(data) {

      console.log(data);
    }
  });


  $("#applyFilter").on("click", function() {

    ahv.params(controls.data().parameters).run(function(data) {
      console.log(data);
    }).fail(function(e) {
      console.log(e);
    });

  });


});