Visualize: Report And Control

Test plugins

by Yuriy Bablyukh

HTML

<script src="http://code.jquery.com/jquery-2.1.0.js"></script>
<!--Provide URL to visualize.js-->
<script src="http://localhost:8080/jasperserver-pro/client/visualize.js"></script>

<table>

  <tr>
    <td colspan="2">
      <lablel><input type="checkbox" id="paginated" checked>Paginated</lablel>
      <select id="type">
        <option value='pdf'>PDF</option>
        <option value='xlsx' selected>XLSX</option>
      </select>
      <button id="export">
        Export
      </button>
    </td>
  </tr>
  <tr valign="top">
    <td style="width:80%">
      <div id="container"></div>
    </td>
    <td style="width:20%">
      <div id="inputContainer"></div>
      <button id="applyFilter">
        Apply
      </button>
    </td>
  </tr>
</table>

CSS

table {
  width: 100%;
}

JavaScript

visualize({
  auth: {
    name: "superuser",
    password: "superuser"
  }
}, function(v) {

  var reportUri = '/public/Samples/Reports/Cascading_Report_2_Updated';
  var report = v.report({
    resource: reportUri,
    container: "#container",
    error: function(error) {
      console.log(error);
    },
    success: function(data) {
      console.log(data);
    }
  });

  var inputControls = v.inputControls({
    resource: reportUri,
    container: "#inputContainer",
    error: function(err) {
      console.log(err);
    }
  });

  $("#export").on("click", function() {
    var exportOption = {};
    exportOption.ignorePagination = !$("#paginated").is(':checked');
    exportOption.outputFormat = $("#type").val();
    console.log(exportOption);
    report["export"](exportOption, function (link) {
            window.location.href = link.href ? link.href : link;
        }, function(error){console.error(error)});
  });


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

    inputControls.run().fail(function(error) {
      console.error(error);
    }).done(function() {
      report.params(inputControls.data().parameters).run(function(data) {
        console.log(data);
      }).fail(hendleError(err));
    });

  });

});

function hendleError(err) {
  console.error(err);
}