w3hello.com logo
Home PHP C# C++ Android Java Javascript Python IOS SQL HTML videos Categories
  Home » BACKBONE JS » Page 1
Underscore Template Looping, Without A Loop?
You are listening to the add event in the collection, which will be fired after a fetch operation for each model retrieved from the server: this.listenTo(NewTimeSheetCollection, "add", this.AddMyModel); NewTimeSheetCollection.fetch(); So your server is returning 17 rows, the add event is fired 17 times, and every time your AddMyModel function is rendering the template. (If you have a look at th

Categories : Backbone Js

Backbone.Model how to listen for changes on multiple attributes only once
The easiest thing to do, for me anyway, is to change the way you think about the events. For instance, in this case, it isn't that you want to only do it once, it is that you want to do something after both have finished. The easiest way to do that here would be to debounce the event: this.listenTo(this.model, 'change:width change:height', _.debounce(this.doLayout, 1)); That way it will only r

Categories : Backbone Js

multiple router vs single router for large application in Backbone JS
I would recommend having an app router, which can define subrouters - I have written an example here under "Routing" - Backbone project organization

Categories : Backbone Js

How to trigger an error during Backbone model fetch call?
If you want to execute the callback attached to the error option, you'll need to modify your model's parse function as follows. parse: function(response, options) { var data = response.modeldata; var error = options.error; if (data.inaccessible === true) { if ( error ) error( this, response, options ); } else { return data; } } Hope this helps.

Categories : Backbone Js

Backbone.js CollectionView not rendering html
DayView = Backbone.View.extend({ tagName: 'li', render: function(){ this.$el.html('<h3>' + this.model.get('comments') + this.model.get('minutes') + '</h3>'); } }) instead returning string in render you should set the html to view's el as you are appending el element in collectionView

Categories : Backbone Js

Backbone fetching a model: Parsing format in array of objects
The format google-chrome console adopts for arrays is like the first array I've posted in the question. I was thinking that the numbers appears before the object itself was something that backbone it was adding when you perform a fetch action ... I was thinking this because when I debugged my code I had an error that said me it was not possible to access to an attribute. After more debugging I re

Categories : Backbone Js

Backbone js: Only render when specific attributes have changed?
Backbone also trigger a change event for each attribute when they change, in the form change:attributeName, so the following is what you want: initialize: function() { this.model.bind('change:attributeName', this.render, this); }, From the docs: "change:[attribute]" (model, value, options) — when a specific attribute has been updated.

Categories : Backbone Js

Returning a Backbone Collection and iterating through - not with a View
Underscore.js functions should serve you well. I'm not sure what you want to do with the models in the collection, but check out http://underscorejs.org/ it has quite a few methods that will handle backbone collections. For example you could do _.toArray(_bookCollection).length

Categories : Backbone Js

Where is Backbone.Model.extend method defined?
At the end of the source, under Helpers, there's a helper function to correctly set up the prototype chain, for subclasses : var extend = function(protoProps, staticProps) { } which is then assigned to all Backbone prototypes Model.extend = Collection.extend = Router.extend = View.extend = extend;

Categories : Backbone Js

Using Backbone.js - Removing jQuery
Backbone use jQuery only to manipulate with DOM. If you won't do that - you didn't need jQuery ( for example you are using only model system with enother framework or work at server side). You also can use another lib instead of jQuery ( with the same API ) - like Eksoskeleton or other likes - - just redefine Backbone.$ P.s look at https://github.com/inkling/backbone.native and https://github.c

Categories : Backbone Js

Backbone Collection get property
In order to use the get() function from a Backbone.Collection you need to know the model id or cid wanted. For instance, lets say your data coming from the server is like follow: [{ id: '123', name: 'Alex' }, { id: '456', name: 'Jhon' }] In that case you can do this: this.collection.get('123').get('name') // Return "Alex" Keep in mind that collection is just a set of model, so behind the sc

Categories : Backbone Js

Backbone project organization
Here are a few tips after working on very large backbone apps. It's not exhaustive or final.. Divide into two directories The server directory e.g server/ The publicly accessible directory e.g. www/ Also when you run your build task it would build the app into a distributable version into a build/ or dist/ directory. Probably using Gulp or Grunt. Extend Backbone Your entire app will consist

Categories : Backbone Js

why the drawSomething doesn't work
The problem is that inside setInterval callback context this is not what you expect (it's global object window). Simplest fix is to save proper object reference in variable: var self = this; setInterval(function() { //alert("Hello"); self.drawSomething(); }, 1000);

Categories : Backbone Js

WHat would be a proper way to require modules
The general rule is that everything you load through RequireJS is loaded once and only once. The first time the module is needed (due to require or a define that has the module as a dependency), it will be actually fetched from the network and then its factory function will be executed. (The factory is the function that you give to define.) The result of the factory function is cached by Require

Categories : Backbone Js

Backbone.js: this.model in event is first model rendered, instead of the model associated with DOM element
Your problem is that all your app.ItemViews share the same el: app.ItemView = Backbone.View.extend({ //... el: "#container", and the events are bound to the el through delegation. The result is that your events are all confused because everyone is trying to listen for the same event on the same element. The easiest solution is to move the <div> out of your #item-template template

Categories : Backbone Js

Backbone / ReactJS view not recognizing JSX
JSX must be compiled to JavaScript before browsers can understand it. You can use the jsx tool to do this. JSX transformer and Require.js are incompatible.

Categories : Backbone Js

Backbone/Marionette Fetching large collection causes browser to freeze
Render all 1000 elements isn't good idea - DOM will become too big. Also on fetch there are parse for all 1000 models, and it works synchroniously. So there are two ways - load less data, or splist data to parse/render by chunks

Categories : Backbone Js

Backbone View, Event Handler and bindAll
First of all, I'm guessing that $("body").on "click", ".stuff", -> is actually inside your initialize method and you just have a formatting problem. Your code doesn't make a lot of sense otherwise. The problem you'll run into is that jQuery controls what @ (AKA this) is inside the callback function. So just binding functionB won't be sufficient because you can't get at functionB without having

Categories : Backbone Js

Backbone js. simple error fetching data from the server
the fetch operation is asynchronous, so you have to wait till the ajax call is completed nModel.fetch({ success:function(){ console.log(nModel.get("minutes")); }});

Categories : Backbone Js

Splitting a collection into multiple views (backbone/marionette)
Creating subviews and collections in views is not a good practice, use the controller. You can split data with an underscore _.groupBy(list, iteratee, [context]) and manually set necessary collections in the controller. Nice tutorials about application architecture can be found there http://www.backbonerails.com/series. Another way, if you do not have a lot of data, you can override attachHtml me

Categories : Backbone Js

Backbone.js : a Simple render function
The el property is a DOM element, not a string. To get the full HTML string, you can use use the outerHTML property: console.log(newView.el.outerHTML);

Categories : Backbone Js

Collection change event on an attribute which is a model itself
I think the cleanest way is to forward events through the parent model. Look at my example: http://jsfiddle.net/w8n9erqo/ But also you can override collection methods _addReference and _removeReference to add custom event binding logic. http://backbonejs.org/docs/backbone.html#section-118 Hope this helps

Categories : Backbone Js

Is there a general way to cancel AppRouting in Marionette?
In a current marionette app I have a global click handler which handles click events on all links (href like #settings/user) and then manually calls Backbone.history.navigate(route, {trigger: true|false});. When this handler is called I am checking a global defined variable like App.isScreenLocked, and if that is true I do not call navigate.

Categories : Backbone Js

Backbone Marionette: Don't display view before all images have loaded
I think your approach is correct, I will try to encapsulate the data/image loading in one function, using a repository probably $.when(applicationsRepository.getAll()).then(function (apps) { var appsView = new App.Views.ApplicationListView({ collection: apps}); App.layout.mainRegion.show(appsView ); }); So, this code will be part of you controller, as you already have it

Categories : Backbone Js

Is it possible to remove a model by cid?
You can do it using this code (see collection#remove method): var modelToRemove = collection.findWhere({cid: "SOME_ID_HERE"}); collection.remove(modelToRemove); See also findwhere docs. Edit From the output of the console.log method it appears that the @collection variable in your above code is not a true Backbone.Collection, but rather a model pointing to the collection. Thus, you should mod

Categories : Backbone Js

Yeoman generator-backbone app in test
Did you make sure you create a folder for you app, then cd into it and run the generator. You should have your app up and running, for example myApp // first create your new app folder, then cd into it mkdir myApp cd myApp // scaffold your backbone app npm install -g generator-backbone yo backbone That should be all you need

Categories : Backbone Js

Backbone-relational parsing nested models
if you use simple backbone model? this.model.get('items')[0].features or if you create collection based on items array: this.collection.at(0).get('features')

Categories : Backbone Js

Right context with rivets.js declarative binding
I am not sure why you what to do this or why your code is structure like this, but if you really want to do it, you can configure rivets in that way. Default rivets configuration: rivets.configure({ // Attribute prefix in templates prefix: 'rv', // Preload templates with initial data on bind preloadData: true, // Root sightglass interface for keypaths rootInterface: '.', // Template d

Categories : Backbone Js

Laravel RESTful returning 301 state
Solved! On backbone collection configuration, I had url parameter with '/' at the end. rooms/ Deleted that slash and now it works fine. Hope someone find's this helpful

Categories : Backbone Js

backbone model doesn't match expected structure
events.first() returns a backbone model you can do events.first().get("eventId") to get the eventId that's how we get model properties properly

Categories : Backbone Js

Must Backbone el be an element in the Dom and not in the template?
I don't believe that it really matters in essence and unless I'm missing something obvious, I don't understand how defining the el in the template would be safer. I tend to define my el as an existing DOM element that serves as a wrapper for the view template, but at times I also define it at runtime, depending on the situation. The concept of elen views in general are related to Event bubbling

Categories : Backbone Js

Backbone.js view uses instance of self to render children. Is that okay?
It's perfectly fine to do that. This is very similar to Marionette's CompositeView. Marionette's composite's default behavior (if the itemView/childView property isn't defined) is to use the composite view itself as the children view. https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.compositeview.md I personally have used this structure myself. I had a hierarchica

Categories : Backbone Js

Single element (ul) View in backbone
This is one of the problems that Marionette addresses really well, it provides a good of defaults that reduce some boilerplate code, collection and item views are good examples here. Here is a simple example that you can review and see if it is good for your needs BookItemView = Marionette.ItemView.extend({ tagName: 'li', template: '#itemView-template' }); BookCollectionView =

Categories : Backbone Js

Make templateHelpers wait until async function ends in Marionette
As discussed in the comments, the solution is to re-render the view after your async load completes. This works because the render method in your Marionette view will call templateHelpers again and specifically will not call initialize again. function querySuccess(tx, results) { var len = results.rows.length; if(len>0) that.value = results.rows.item(0).value; that.render();

Categories : Backbone Js

How use set method on model Backbone to change a data?
Are you sure you're rendering the view? Try to put this code into an initialize method instead, and everything should work just fine. By the way, this should work even without a set method call: initialize: function() { var n_nodes = this.model.get("nodes"); n_nodes[0] += 1; return this; },

Categories : Backbone Js

How to load this file given a specific Backbone route?
I didn't found any forum or discussion relating to this however the process of rendering a template from a backbone route can be done through var router = Backbone.Router.extend({ routes : { '/contact' : 'contactUsHandler' }, home : function() { var url = urlToRequestServerToRenderATemplate, that = this; $.ajax({

Categories : Backbone Js

Marionette 2.0 - Uncaught ViewDestroyedError: View has already been destroyed and cannot be used.
I looks like you are using references to views that have been already removed. My first assumption is that you should recreate views: App.on("currency:change", function() { cartView = new CartView(); totalView = new TotalView(); cartRegion.show(cartView) totalRegion.show(totalView); }); I'm not sure how your application works but I can guess that you have something li

Categories : Backbone Js

Backbone toJSON with model in model
JSON.stringify(model) example: http://jsfiddle.net/2Asjc/1/ JSON.stringify will call toJSON on its own as it walks the data structure. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify#toJSON_behavior

Categories : Backbone Js

Backbone Marionette: How to use preventDestroy: true
It is removed from region but not destroyed. When you pass preventDestroy : true, it means that marionette doesn't itself call destroy method and event on previous view. Destroy method provides ubinding events and calls destroy on subviews and so on (https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.view.md#view-destroy). But call show with preventDestroy : true st

Categories : Backbone Js




© Copyright 2018 w3hello.com Publishing Limited. All rights reserved.