How to use the backgrid.Grid function in backgrid

To help you get started, we’ve selected a few backgrid examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github ipoddubny / webcdr / public / js / cdr / CDRView.js View on Github external
onShow: function () {
    var gridView = new Backgrid.Grid({
      columns: columns,
      collection: this.collection,
      className: 'backgrid backgrid-striped'
    });
    var paginatorView = new Backgrid.Extension.Paginator({
      collection: this.collection
    });
    // TODO attach filter state to collection, and restore filter values
    // in the interface on creating the view
    var filterView = new FilterView();

    this.listenTo(filterView, 'search', function (filter) {
      this.collection.state.currentPage = 1;
      _.extend(this.collection.queryParams, filter);
      this.collection.fetch();
    });
github DefinitelyTyped / DefinitelyTyped / types / backgrid / backgrid-tests.ts View on Github external
constructor(viewOptions?: Backbone.ViewOptions) {
	super(viewOptions);
	this.testCollection = new TestCollection();
	this.gridView = new Backgrid.Grid({
            columns: [new Backgrid.Column({name: "FirstName", cell: "string", label: "First Name"}), 
		      new Backgrid.Column({name: "LastName", cell: "string", label: "Last Name"}),
		      new Backgrid.Column({name: "EMail", cell: "string", label: "E-Mail"})],
		      collection:this.testCollection,
		     });
					  
	
    }
github archivist / archivist / src / manager / views / grid.js View on Github external
initialize: function() {
    this.grid = new Backgrid.Grid({
      row: ClickableRow,
      columns: this.options.columns,
      collection: this.options.collection
    });
    $(this.$el).append(this.grid.render().$el);
    this.paginator = new Backgrid.Extension.Paginator({
  		columns: this.options.columns,
  		collection: this.options.collection
	  });
	  $(this.$el).append(this.paginator.render().$el);
    this.createContextPanel();
    this.contextMenu.reset(this.panel);
  },
  afterRender: function() {
github archivist / archivist / client / platform / views / persons.js View on Github external
initialize: function() {
    $('#' + this.icon).addClass('active');
    this.grid = new Backgrid.Grid({
      row: PersonRow,
      columns: this.options.columns,
      collection: this.options.collection
    });
    $(this.$el).append(this.grid.render().$el);
    this.paginator = new Backgrid.Extension.Paginator({
      columns: this.options.columns,
      collection: this.options.collection
    });
    $(this.$el).append(this.paginator.render().$el);
  },
  filters: function() {
github archivist / archivist / client / platform / views / definitions.js View on Github external
initialize: function() {
    $('#' + this.icon).addClass('active');
    this.grid = new Backgrid.Grid({
      row: DefinitionRow,
      columns: this.options.columns,
      collection: this.options.collection
    });
    $(this.$el).append(this.grid.render().$el);
    this.paginator = new Backgrid.Extension.Paginator({
      columns: this.options.columns,
      collection: this.options.collection
    });
    $(this.$el).append(this.paginator.render().$el);
  },
  filters: function() {
github archivist / archivist / client / platform / views / grid.js View on Github external
initialize: function() {
    this.grid = new Backgrid.Grid({
      row: ClickableRow,
      columns: this.options.columns,
      collection: this.options.collection
    });
    $(this.$el).append(this.grid.render().$el);
    this.paginator = new Backgrid.Extension.Paginator({
  		columns: this.options.columns,
  		collection: this.options.collection
	  });
	  $(this.$el).append(this.paginator.render().$el);
    this.createContextPanel();
    this.contextMenu.reset(this.panel);
  },
  afterRender: function() {
github archivist / archivist / client / platform / views / locations.js View on Github external
initialize: function() {
    $('#' + this.icon).addClass('active');
    this.grid = new Backgrid.Grid({
      row: LocationRow,
      columns: this.options.columns,
      collection: this.options.collection
    });
    $(this.$el).append(this.grid.render().$el);
    this.paginator = new Backgrid.Extension.Paginator({
      columns: this.options.columns,
      collection: this.options.collection
    });
    $(this.$el).append(this.paginator.render().$el);
  },
  filters: function() {
github Radarr / Radarr / src / UI / Activity / History / HistoryLayout.js View on Github external
_showTable : function(collection) {

        this.history.show(new Backgrid.Grid({
            columns    : this.columns,
            collection : collection,
            className  : 'table table-hover'
        }));

        this.pager.show(new GridPager({
            columns    : this.columns,
            collection : collection
        }));
    },
github Radarr / Radarr / src / UI / System / Task / TaskLayout.js View on Github external
_showTasks : function() {
        this.tasks.show(new Backgrid.Grid({
            columns    : this.columns,
            collection : this.taskCollection,
            className  : 'table table-hover'
        }));
    }
});
github Radarr / Radarr / src / UI / Episode / History / EpisodeHistoryLayout.js View on Github external
_showTable : function() {
        if (this.collection.any()) {
            this.historyTable.show(new Backgrid.Grid({
                collection : this.collection,
                columns    : this.columns,
                className  : 'table table-hover table-condensed'
            }));
        }

        else {
            this.historyTable.show(new NoHistoryView());
        }
    }
});

backgrid

Backgrid.js is a set of components for building semantic and easily stylable data grid widgets with Backbone.

MIT
Latest version published 8 years ago

Package Health Score

56 / 100
Full package analysis

Popular backgrid functions