Comments (6)
You can use sortBy
, as you are, or you can use a comparator
function to keep models in a consistent sort order at all times:
http://documentcloud.github.com/backbone/#Collection-comparator
If you change the comparator
function, you can call sort()
to re-sort the set. If you're listening for "refresh"
events, everything should update correctly, automatically.
Hope that helps...
from backbone.
Thanks - yes that makes sense. So in my case after each refresh, add etc... I would need to clear my view correct?
For example:
If my comparator is sorting models by first name and I'm already displaying Bob and Charlie and than I add Albert, I would need to clear the view and render again.
from backbone.
after each refresh, add etc... I would need to clear my view correct?
Yes, in the "refresh"
event, you would clear and re-render the entire list of models.
If my comparator is sorting models by first name and I'm already
displaying Bob and Charlie and than I add Albert, I would need to
clear the view and render again.
No, you just have to insert new views at the appropriate location in the DOM. Instead of just a simple jQuery .append()
, you might want to use insertBefore()
or insertAfter()
, to put Albert in the right place.
from backbone.
To do insert before or after - What would be the most efficient way to find it's neighbours in the Collection?
I was thinking if I bind to the add event and get the index of the newly inserted model I could check to see what the next index is or something like that.
from backbone.
Yep, you can do:
collection.indexOf(model)
... to get its position within the collection. From there, you can look up the adjacent elements, either by id
, or by direct reference from the models. For the record, our code that handles this case looks like this:
var view = new dc.ui.Project({model : model}).render();
var index = Projects.indexOf(view.model);
var previous = Projects.at(index - 1);
var previousView = previous && previous.view;
if (index == 0 || !previous || !previousView) {
$(this.projectList).prepend(view.el);
} else {
$(previousView.el).after(view.el);
}
from backbone.
Very cool - thanks for the help.
from backbone.
Related Issues (20)
- Backbonejs (1.4) version compact with jQuery (3.4.1) ? HOT 2
- Token error 'delete' on an old browser HOT 3
- How can I use installed npm library in backbone view
- Backbone is being actively maintained HOT 29
- Embrace prototypes HOT 12
- Upgrade devDependencies, add lockfile HOT 21
- Replace travis with GH Workflows HOT 22
- Should Backbone.Collection throw an error when client code attempts to add the same model twice? HOT 8
- Browser tests that don't work in Sauce labs
- Separate fetch/save api into plugin or external module HOT 17
- Bug in _removeModels: function(models, options) { HOT 1
- Uots about time
- error event not firing for Collection.create with wait true HOT 4
- Clean up misguided legacy changes HOT 1
- Community question: who is interested in reviewing my pull requests? HOT 3
- Testing against outdated vendor libraries HOT 1
- Misleading line in CONTRIBUTING.md HOT 2
- ES Modules: please discuss HOT 29
- Changelog? HOT 1
- Will updating backbone also update jquery? [answered: no] HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from backbone.