RenderTable

by Yuriy Bablyukh

HTML

<script type='text/javascript' src="https://code.jquery.com/jquery-2.1.0.js"></script>
<script src="http://infra-platforms-phase2-105-vchepuri.pfa.jaspersoft.com:8080/jasperserver-pro/client/visualize.js"></script>
<br>


<br>

<div id="container"></div>

<table>
  <tr>
    <td><button id="previousPage">&#60;&#60;</button></td>
    <td>Page </td>
    <td><input id="currentPage" value="1" style="width:30px;" /></td>
    <td> of </td>
    <td>
      <div id="totalPage"></div>
    </td>
    <td><button id="nextPage">&#62;&#62;</button></td>
  </tr>
</table>

CSS

body {
  background-color: #92a8d1;
}

#container table.jrPage tr:last-child {
  background-color: #92a8d1;
}

JavaScript

// Visualize: Pagination (Next/Previous)

visualize({
  auth: {
    name: "superuser",
    password: "superuser"
  }
}, function(v) {
  var report = v.report({
    resource: "/public/main_jrxml",
    container: "#container",
    events: {
      changeTotalPages: function(totalPages) {
        if (typeof(totalPages) === "undefined" || totalPages === 0) {
          console.log("report is empty");         
        } 
        if (typeof console != "undefined") {
          console.log("Event changeTotalPages executed, we have: " + totalPages + " - pages");
          $("#totalPage").val(totalPages);
        }
      },
      reportCompleted: function(status) {
        if (typeof _viz.report.pages() !== "object") {
          $("#currentPage").val(_viz.report.pages());
        }
      },
      changePagesState: function(page) {
        // executed when page state changed
        if (typeof console != "undefined") {
          console.log("Event changePageState executed with page: " + page);
        }
        $("#pageNumber").val(page);
      }
    }
  });

  $("#previousPage").click(function() {
    var currentPage = report.pages() || 1;

    report
      .pages(--currentPage)
      .run()
      .fail(function(err) {
        alert(err);
      });
  });

  $("#nextPage").click(function() {
    var currentPage = report.pages() || 1;

    report
      .pages(++currentPage)
      .run()
      .fail(function(err) {
        alert(err);
      });
  });
});