%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /home/riacommer/public_html/admin/vendor/backbone.paginator/examples/
Upload File :
Create Path :
Current File : /home/riacommer/public_html/admin/vendor/backbone.paginator/examples/client-mode.html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />

    <title>backbone-pageable client mode demo</title>
    
    <link rel="stylesheet" href="css/bootstrap.css" />
    <link rel="stylesheet" href="css/bootstrap-theme.css" />
    <link rel="stylesheet" href="css/backgrid.css" />
    <link rel="stylesheet" href="css/extensions/paginator/backgrid-paginator.css" />

  </head>
  <body>
    <div id="main">
      <div class="container">
        <div class="row">
          <div class="col-md-12 alert alert-info">
            Feel free to peek into the source of this page and play with the code in your browser&apos;s console.
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div id="grid"></div>
            <div id="paginator"></div>
          </div>
        </div>
      </div>
    </div>

    <script src="js/jquery.js"></script>
    <script src="js/underscore.js"></script>
    <script src="js/backbone.js"></script>
    <script src="../lib/backbone.paginator.js"></script>
    <script src="js/bootstrap.js"></script>
    <script src="js/backgrid.js"></script>
    <script src="js/extensions/paginator/backgrid-paginator.js"></script>
    <script>
      var columns = [{
        name: "id",
        editable: false,
        cell: Backgrid.IntegerCell.extend({
          orderSeparator: ''
        })
      }, {
        name: "name",
        cell: "string"
      }, {
        name: "pop",
        cell: "integer"
      }, {
        name: "percentage",
        cell: "number"
      }, {
        name: "date",
        cell: "date"
      }, {
        name: "url",
        cell: "uri"
      }];

      var Territories = Backbone.PageableCollection.extend({
        url: "json/pageable-territories.json",
        mode: "client"
      });

      var territories = new Territories();

      var grid = new Backgrid.Grid({
        columns: columns,
        collection: territories
      });

      var paginator = new Backgrid.Extension.Paginator({
        collection: territories
      });

      $("#grid").append(grid.render().$el);
      $("#paginator").append(paginator.render().$el);

      territories.fetch();
    </script>
  </body>
</html>

Zerion Mini Shell 1.0