cloudflarearchive / backgrid Goto Github PK

Maybe I missed something, but I can't reproduced your basic example in console where I Have Backbone 1.9.10, Underscore 1.4.0, jQuery 1.8.0, BackGrid 1.3.0 and territories.json in my local environment due to bypassing CORS issues.
I also can't reproduce your page from tar because it strongly depend on codemirror folder which is totally empty.

So could you please provide some basic example without third-party software from that folder?

Thanks.

Steps to reproduce:

1. Navigate to http://wyuenho.github.com/backgrid/#examples and scroll down to Paginator result example
2. On the paginated controls use the forward arrow to navigate to page no 17
3. Try to click any of the pages < 17

What happens: page navigation is broken, throws

RangeError: currentPage must be firstPage <= currentPage <= totalPages if 1-based. Got 23. backbone-pageable.js:557

Platform:
Safari version 6.0.2 (7536.26.17)
Mac OS X 10.7.5

This should probably be auto-width. Just a simple JS routine that even spreads out the table's widths to the columns with do.

Supporting bower takes no effort and has no effect on the source code, so it should probably be supported as it seems to be a pretty popular frontend package installer. There should be a componant.json file for the core and each extension.

Support component takes a little more work, but it also has a far superior and thought-out packaging structure most suitable for front-end components.

This depends on #25

Related to issue #7

In some cases the columns collection may be changed using the reset method: add and remove events will not be triggered. The grid should listen to reset events as well.

Uncaught TypeError: Cannot read property '_listenerId' of undefined backbone.js:196
Backbone.Events.listenTo backbone.js:196
Backgrid.Extension.Paginator.Backgrid.Footer.extend.initialize backgrid-paginator.js:64
Backbone.View backbone.js:1236
child backbone.js:1467
child backbone.js:1467
Backgrid.Grid.Backbone.View.extend.initialize backgrid.js:2101
Backbone.View backbone.js:1236
child backbone.js:1467
(anonymous function) states:168
jQuery.Callbacks.fire jquery.js:975
jQuery.Callbacks.self.fireWith jquery.js:1085
jQuery.extend.ready jquery.js:407
DOMContentLoaded jquery.js:84

The paginator references "fullCollection" always, yet it's only defined when the paging mode is client.

Very new to backbone/backgrid so forgive me if this is just user error but the rendered paginator does not seem to be responsive to changes in the collection size with respect to page links.

• The links are generated before the json call to get the data, so unless you preload the total number of records -- the individual page links do not show. Even though this information is available in the json response.
• Related to above, if the collection size changes -- the page links are not updated unless you refresh the page.

Backgrid 0.1.2 has been released. You can see the change log here.

This maintenance contains 11 bug fixes and improvements done in the last 3 weeks since the initial release of Backgrid 0.1.

Highlights:

• All paginated grids can now be initialized synchronously without having to fetch first.
• Grid will now refresh itself on columns reset, cells will refresh themselves during display mode on model attribute changes.
• Lots of bug fixes for the paginator.
• backbone-pageable has been upgraded to 1.1.5, you MUST upgrade backbone-pageable to take advantage of the bug fixes in Backgrid 0.1.2.

@ekanna @dheerajaggarwal @TimNZ @benhowdle89 @stnor @jayelkaake @IgorTimoshenko @blindgaenger @dburrows @ain

backbone-pageable.js must be included in order for sorting to work, otherwise, returns the errors

Chrome:
Uncaught TypeError: Expecting a function in instanceof check, but got [object Object]

Firefox:
TypeError: invalid 'instanceof' operand Backbone.PageableCollection

Not a code fix, simple documentation update should work.

When setting 'renderable: false' on a column definition only the last row of the collection is rendered. I assume this option is to hide a column?

Sorry I am using the issue system to ask a question.
Is there a plan to provide a command cell (or it already exists)? I need to support delete/select operations from the grid. All I need is a simple cell type that is not bound to any model value. It renders to a button link (whose text, obviously, should be configurable ), and when clicked fires an select event attached with the model.
Thanks,

Kai

https://github.com/wyuenho/backgrid/blob/0.1/src/header.js#L188

• Minify document resources
• Ignore all generated files in master branch
• Squash all the previous ugly commits
• Tag 0.1
• Upload the 0.1 zip and tar.gz
• Open a 0.2-wip branch

Installed all the required packages - get this error:

gmake backgrid.min.js
gmake[2]: Entering directory /Users/dlf/data/workspace/backgrid/src' echo "/*\n\ backgrid\n\ http://github.com/wyuenho/backgrid\n\n\ Copyright (c)date +%YJimmy Yuen Ho Wong\n\ Licensed under the MIT @license.\n\ */" | cat - backgrid.min.js > "/tmp/basename backgrid.min.js" && mv -f "/tmp/basename backgrid.min.js`" backgrid.min.js
cat: backgrid.min.js: No such file or directory

This is a bug in Bootstrap 2.3.0 twbs/bootstrap#6884.

TextCell defaults to pop up without a backdrop, Bootstrap 2.3.0's modal dialog doesn't like it and craps out.

Allow use of Backgrid without Backbone.PageableCollection.

If you don't use PageableCollection, an error is thrown when sort does the check collection instanceof Backbone.PageableCollection. This can be fixed simply by adding a check for PageableCollection to the if statement. See below:

sort: function (columnName, direction, comparator) {

    comparator = comparator || this._cidComparator;

    var collection = this.collection;

    if (Backbone.PageableCollection && collection instanceof Backbone.PageableCollection) {
      var order;

Great great library, your work on this is much appreciated.

How do you suggest I force a re-render of a row on the model being updated externally?

I have an 'Actions' column with a button that does something that could update the model.

It seems that I then need to re-render each cell in the row, but the issue is I don't have access to the current row and child cells from an event handler in my Backgrid.Cell.extend({...})

The views are too deeply nested and Backbone.Events has become unwieldy. Needs to the internal event dispatch mechanism.

Potential libraries this project could use:

- Backebone.wreqr.EventAggregator.

- RadioJS

Just use Backbone.on/off/trigger/listenTo/stopListening in 0.9.9.

Fantastic work! Thanks for sharing.

It would be great if there was filtering support, so that one should type text in an input box and filter the rows based on the input. I personally would prefer a "global" filter and not per column.

Would that be something that you could consider?

From #93 "When editing in a InputCellEditor, pressing tab will exit editing mode. However editing does not proceed to the next editable cell in the same row.

That would be a welcome addition. I'm currently looking where this could possibly be added, but as of now I'm not sure how a "cell" would look up more information about a table and trigger an edit on an adjacent cell.

Even more awesome would be if tabbing out of the last cell, the edit would move to the next row if it exists, or add one as necessary."

Remaining tasks:

• Find out why some keybindings don't work in the Cells demo grid (It's not a grid and there's no body)
• BooleanCell is still acting weird - tabbing into it focuses the checkbox but doesn't go into edit mode because there's no such thing for BooleanCell
• SelectCell still refuses to obey keyboard navigation bindings
• Configurable keybindings
• Make sure all the extensions work for the new keybinding mechanism
• Test cases

The example code shown in the Body // Custom Row section does not work properly. (http://wyuenho.github.com/backgrid/#api-body).

Specifically, when instantiating a new Grid, if a body argument is provided which
has a custom row argument inside of the body, the row argument
would not get used by the body.

This is because the row argument would not get sent as part of
the options dictionary. But it is set on the body as an attribute.

Within the Grid initialize function:

    this.body = options.body || this.body;
    this.body = new this.body({
      columns: this.columns,
      collection: this.collection
    });

options.body is present and contains the custom row.

However, within the Body initialize function...

    self.row = options.row || Row;

Because options.row does not exist, self.row gets set as Row, and overrides my custom row.

This is fixed by doing:

  initialize: function (options) {
    ...

    self.row = options.row || self.row || Row;
    ...

Feature Request:
Right now, columns are tied to a model attribute. However, I want to have a cell value be composed of multiple model attributes. In general, it would be great to have the flexibility of having the formatter be passed the model, so we can pull multiple attributes from the model to construct the cell value.

Use case:
For example, I want my cell to be a link composed like this:
<a href="./model.get('id')/edit/">model.get('name')</a>

I can do this by defining my own cell with a render function which passes in the model. But I think this should be a general feature. Something like this:

render: function () {
    this.$el.empty().text(this.formatter.fromModel(this.model));
    return this;
},

Obviously it would need to enforce the cell to have a fromModel() implementation.

Let me know what you think!

http://stackoverflow.com/questions/14580336/backgrid-how-does-it-know-what-numbers-to-generate-for-pagination

I was looking for a cell which can display a link with a different display label to the link URI.

Obviously there is a URI cell but given "http://santaclaus.com/rednose/" I would like to display "RedNose"

Does one of the existing cell types match this use case (I have already implemented a custom cell type like this)?

Steps to reproduce:

1. Initialize grid instance with empty collection
2. grid.insertRow doesn't insert new row in the grid

Provide an extension that offers a special cell type that isn't connected to the model, but instead sends an event containing the model such that further actions can be performs on the handlers.

You can already achieve this using a pure CSS.

http://tjvantoll.com/2012/11/10/creating-cross-browser-scrollable-tbody/

A similar approach should probably be baked into the default stylesheet.

The problem is lining up the column widths of the th and tds. This will have to be done together with #5. The JS necessary to calculate a width for each column is trivial. Let me know if you get to it first.

For now, you can give a CSS min-width manually to each column's th and td.

The example given has following grid initialization code

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

as you can see there is no "pageableTerritories" collection defined in the example. I think it should be "territories".