FAQ Database Discussion Community


$.when apparently ignored

javascript,backbone.js,marionette,jquery-deferred
I have a Compositeview that represents a list of tasks with a header that contains a counter for the tasks in such list. I have defined an ui hash for the counter to deal with it and to properly initialize it: The view: ui: { counter: "#counter", }, onRender: function(){...

Bacbone Marionette how to get access to an element in which the view is wrapped up?

jquery,backbone.js,marionette,collectionview
I have CollectionView which has tagName and Id/tagClass. I heed apply plugin to 'tagName' element on onRender event. I can't access it through this.el. var ListView = Backbone.Marionette.CollectionView.extend({ tagName:'article', className:'myClass', id:'myID', childView: ListItemView, onRender: function () { (access to view tagName el).readmore({ speed: 500 }); } }); ...

Why is my Backbone Collection not pulling in data?

javascript,backbone.js,marionette
I'm not getting any errors, but for some reason my data is not being loaded into my views. I'm using Requirejs and Marionette. I've been staring at this so long, it's probably right in front of me and I've just got tunnel vision and cant see it. Here are my...

requirejs returns undefined without dependency

requirejs,undefined,marionette,circular-dependency
On some occasions, requirejs returns an undefined object to my module. I've looked at a number of posts and most of the answer are related to circular dependencies. However I could find none (I have checked several times). I apologize by advance for pasting a quantity of code that I've...

Get Current URL with query parameters in Backbone Marionette

javascript,backbone.js,marionette,backbone-routing
URL : http://localhost:3000/dashboard?ID=10400&Name=10400 I'm trying to get the query params ID and Name from the URL but I get undefined. I have also tried backbone-queryparams but still it does not work. Any idea how to get the current URL with params in Backbone Marionette define([ 'jquery', 'backbone', 'marionette', 'modules/dashboard/controllers/dashboardController', 'backbone.queryparmas'...

Can browserify set global modules?

javascript,backbone.js,marionette,browserify
I'm putting together a Backbone Marionette application with Browserify. When I want to use Backbone or Marionette related functions, the top of each individual module file looks like this: var $ = require('jquery'); var _ = require('underscore'); var Backbone = require('backbone'); Backbone.$ = $; var Marionette = require('backbone.marionette'); Is there...

Marionette CompositeView Sort Rendering

backbone.js,marionette,backbone-views
I have a Marionette (2.4.1) CompositeView and when I do a sort it re-renders the entire view rather than the childView. The header icons revert back. I could fix them on render but is there a way that I can just render the childView? diaryEntries = Backbone.Marionette.CompositeView.extend({ template : diaryEntries,...

Is there a way to iterate through all of the views in Marionette?

backbone.js,marionette,backbone-views
I really want to go through every view programmatically and trigger all of their click events, is there a way to do this?

Can a Marionette.js Behavior trigger an Event?

javascript,backbone.js,marionette,mobile-website,backbone-views
I have a Behavior in Marionette that handles the logic for detecting swipe events. My subviews each incorporate this behavior to know when a swipe gesture has occurred on them. My question is once my Behavior has determined a swipe has occurred, how does it get this information out to...

@ symbol in object key

javascript,backbone.js,marionette
I don't know the proper place to post this question but I was reading the Marionette docs and saw the following code when describing Marionette.Behaviors: var MyView = Marionette.ItemView.extend({ ui: { "destroy": ".destroy-btn" }, events: { "click @ui.destroy": "warnBeforeDestroy" } I have never seen an @ symbol in an object...

Is it possible to get notified only once if several model attributes change simultaniously?

javascript,marionette
I want to have a Marionette ItemView (or LayoutView), which rerenders when its model changes. It is actually pretty easy to implement: modelEvents: { 'change': 'render' } However, not every view displays every attribute of the model. So I had an idea to lessen the number of rerenders by listening...

How to deal with async requests in Marionette?

marionette
I am trying to fill in an ItemView in Marionette with the combined results of 2 API requests. this.standings = App.request('collection:currentStandings'); this.userInfo = App.request('model:userInfo'); this.standings.each(function(s) { if (s.currentUser) { s.set('alias', this.userInfo.alias); s.set('imageURL', this.userInfo.imageURL); } }); userInfoView = new LeagueBar.UserInfo({ collection: this.standings }); The problem is, the combination never happens because...

Marionette - listenTo a custom event triggered from a collection

javascript,backbone.js,marionette
I'm using a Event Aggregator(EA) to keep track of all events in my app. But there is one situation I could not make the EA listen to a custom event triggered from a collection. See more details below. eMgr (Event Manager i.e Event aggregator): define(['backbone.wreqr'],function(Wreqr){ "use strict"; return new Wreqr.EventAggregator();...

Passing variables into Handlebars template when rendering Marionette/Backbone View

backbone.js,handlebars.js,marionette
I'm using Handlebars with Backbone and Marionette. I'm compiling my Handlebars templates and storing them in an object that can be referenced by the view definitions. I'm using a LayoutView and regions to display the various items I need in the UI. What I want to do is pass (boolean)...

marionette controller object, create dynamic prototype methods?

javascript,backbone.js,prototype,marionette
I am using marionette for an app that has many pagess. The controller/router method is repetitive, in each method the view is instantiated and the appRegion shows the view. I would like to create the methods inside a loop. var Controller = Marionette.Controller.extend({}); for(i=0;i<10;i++) { // build dynamic controller methods...

Backbone view undefined is not a function conflict

javascript,backbone.js,marionette
I have these 2 views: Show View define(['backbone', 'hbs!tmpl/show_tmpl', 'item/hide'], function (Backbone, Hide) { return Backbone.Marionette.ItemView.extend({ initialize: function () { console.log('initialize a UserLogin ItemView'); console.log(Hide); // this comes in as undefined }, ... Hide View define(['backbone', 'hbs!tmpl/hide_tmpl', 'item/hide', 'item/show'], function (Backbone, Hide, Show) { return Backbone.Marionette.ItemView.extend({ initialize: function () {...

Marionette.js 2.4.1 - tagName not working

javascript,marionette
I'm trying to follow a tutorial for Marionette.js but I ran into an issue I don't know how to solve. Given the code below, I'm expecting to see the view rendered as a child of the #insertion-point element, wrapped in a h1 tag. By looking at the DOM with Chrome's...

How to move subviews lifecycle responsibilities to Marionette

javascript,backbone.js,marionette
Question How to move subviews lifecycle responsibilities from MyView to Marionette? (see code below) The problem here is that items array is formed dynamically on the server, and I don't want to iterate through them in MyView. Do I need Marionette.CollectionView? Code: I have my-view.hbs template: {{#each items}} <button class="button">name</button>...

navigate not working ONLY for empty fragment after enabling pushState

javascript,.htaccess,backbone.js,marionette,pushstate
So, I had a Backbone Marionette app fully working with hashes. Then, I decided to enable pushState for better UX URLs. I access the app at: http://localhost:8888/multikanban/app I applied the following changes: Enable pushState Backbone.history.start({pushState: true, root: "/multikanban/app/"}); Define the following .htaccess <ifModule mod_rewrite.c> RewriteEngine On RewriteCond %{REQUEST_FILENAME} !-f RewriteCond...

Properly Attaching a Backbone.Marionette LayoutView to the Application

javascript,backbone.js,marionette
I'm trying to use the marionette inspector, but the inspector can not find my views, presumably because they are not properly attached to the Application. What do I need to do to register an instance of Backbone.Marionette.LayoutView with a instance of Backbone.Marionette.Application? Here is my current code (in coffeescript), which...

bacbone marionette pass variable to view method

javascript,backbone.js,marionette
I have simple situation and can't understand why variable that I pass to function always undefined. var ProjectItemView = Backbone.Marionette.ItemView.extend({ template: "#ProjectItemTemplate", initialize: function () { var id = this.model.get('project_id'); $.getJSON('service/api.php/projects/' + id + '/progress').done(function (data) { this.renderProgress('4'); //<== pass here }); }, renderProgress: function (why) { alert(why); //<== undefined...

Extend Coffeescript subclass function from parent in marionette

javascript,backbone.js,coffeescript,marionette
I've got a "FormView" class in my Marionette application that sets up a lot of things for form submissions around my app. I use it every time there is a form. I've also got some helpers that I want to pass into every form template via the templateHelpers method, but...

Maintain Backbone Collection References

backbone.js,collections,marionette
I have been running into the problem of stale collection references. So, I have the following model: ProcessModel = Backbone.Model.extend({ initialize: function() { this.set('steps', new StepsCollection()); } ... }); When the ProcessModel is fetched from the server, the StepsCollection is returned as well. Previously, I had the following parse method:...

Dynamically adding columns to BackGrid inside a Marionette view

marionette,backbone-views,backgrid
So, I have a complicated Marionette app with several composite views. I am attempting to add a dynamic BackGrid to the view, but can't seem to get it to add columns. I create the grid and add it to the view as per this post: Backgrid integration. However, it appears...

Backbone.Marionette + Rails app redirects after form submission. Why?

javascript,ruby-on-rails,forms,backbone.js,marionette
I have a sample app that I'm working on that uses Ruby on Rails for the server backend and Backbone.Marionette for the client-side. The main functionality is a form to "order a widget". I'm using backbone-forms to create the form. The oddity that is throwing things off is that once...

Backbone Marionette ItemView return html

javascript,jquery,html,backbone.js,marionette
I want to render marionette ItemView and append result html() to my div. My code: var ProjectItemView = Backbone.Marionette.ItemView.extend({ template: "#ProjectItem", tagName: 'div', initialize: function () { this.model.on('change', this.life, this); this.model.on('change', this.render, this); }, life: function () { alert(JSON.stringify(this.model)); } }); var tmp = new Project({project_id: 1}); tmp.fetch(); $('#container').append(new ProjectItemView({model:...

Marionette-Backbone how do I make a grid table with a dynamic row and column headers

javascript,backbone.js,marionette
I am trying to make a table grid with dynamic number of rows and column with headers using marionette. I want a grid that looks like: http://jsfiddle.net/zaphod013/c3w61gf6/ So there are columns = ['breakfast', 'lunch', 'dinner'] rows = ['carbs', 'proteins', 'fats'] and rest of the grid is checkboxes. I have made...

Can't find element using UI hash in Marionette Layout

javascript,jquery,backbone.js,marionette
I'm not sure why I can't get the button element using my UI hash. This is what my Layout looks like: Layout: App.Base.Objects.BaseLayout.extend({ // Rest of the code left out for brevity ui: { btnSave: "#btnSave" }, events: { "click @ui.btnSave": "onSave" }, onInitialize: function () { this.listenTo(App.vent, "DisableSaveButton", function(val)...

Marionette.js EmptyChildView

javascript,backbone.js,marionette
Here is my EmptyChildView: define(['marionette', 'underscore', 'text!components/empty-options-view/template.html', 'config'], function(Marionette, _, templateHTML, Config) { 'use strict'; var EmptyOptionsView = Marionette.ItemView.extend({ template: _.template(templateHTML), className: 'empty-options', initialize: function(options) { this.link = options.url; }, templateHelpers: function() { return { externalLink: function() { return Config.get('base_url') + this.link; } }; } }); return EmptyOptionsView; }); Here...

App.on(“start”) is called again when I press back in the browser

backbone.js,marionette
I'm on the latest version of Backbone (1.1.0) and Marionette (2.3.0). I have a hook to initialize the router App.on "start", -> if Backbone.history Backbone.history.start() And when I change routes in my application I use Backbone.history.navigate route, options My problem right now is when I load my application and click...

How to format the values of a model in Marionette Backbone View before rendering?

view,formatting,typescript,rendering,marionette
If you implement the onBeforeRender method the is no way to access the model values in order to format them temporarily Ideally you would want to format the values just before rendering without changing the model values of course! How to do it?...

How to access models inside Backbone Marionete App?

javascript,backbone.js,marionette
actually i'm a backend developer so be gentle if my question is so dumb :) I have an Backbone app initialized like this: var AgendaApp = Mn.Application.extend({ onStart: function() { ... ... var bookings = new Bookings(); bookings.startStream({ remove: false }); } var agendaApp = ... As you see bookings...

How do I add a blank option to a select generated by a Marionette CollectionView?

javascript,backbone.js,marionette
I am rendering a Backbone collection as a select element, and I want it to have a blank option at the top. I am a bit unsure how to best do this using a Marionette CollectionView. (I am aware of the CompositeView but I don't really feel it fits this...

What is the correct way to override Marionette compositeview render

backbone.js,marionette
I am showing a table view using Marionette's composite view. The composite view's template has a tbody with an initial which shows a loadding animation gif. Now, when the render method is called, I want to remove this initial row and then append the results of collection fetch. However the...

Passing a model to a LayoutView Backbone.Marionette

javascript,backbone.js,view,model,marionette
I am attempting to pass a model to a LayoutView so that the particular model attributes can be edited in the view. In my ItemView I have an event that grabs the selected model and assigns it to my global App- var ItemView = Backbone.Marionette.ItemView.extend({ template: _.template(ItemTemplate), tagName: "tr", attributes:...

Marionette Controller Best Practice

javascript,backbone.js,marionette
According to the v2.4.1 Marionette documentation controllers are being deprecated: Warning: deprecated. The Controller object is deprecated. Instead of using the Controller class with the AppRouter, you should specify your callbacks on a plain Javascript object. I'm confused as to what the best practices are now that they are deprecated?...

marionetteItemView Childview, events not triggered

backbone.js,marionette
So this is the code on the ParentView: relevant method: openChildView: function(){ var childView = new ChildView({ container: $container //container where the child map should be appended }); childView.show(); } this is the code of the ChildView: ChildView = Marionette.ItemView.extend({ template: _.template($(templates_c).filter('#my_child_view_template').html()), ui: { saveButton: 'button.js-save', uploadButton: 'button.js-upload', deleteButton: 'button.js-discard'...

Backbone sync issue firing POST instead of PUT

javascript,jquery,backbone.js,underscore.js,marionette
I have written the following code in my model: urlroot: '/url/sms', setAuthId: function(value) { var _this = this ; if (this.get("smsauth") != value) { this.set("smsauth",value); this.save(); //Ideally, I want to achieve this AJAX call request with backbone. // $.ajax({ // url: "/url/sms", // data: value, // type: 'PUT', // processData:...

how to build a chain of calls render itemViews in marrionete.js deferred with async function inside itemView

javascript,jquery,callback,marionette,deferred
I have a very simple structure ProductsList.TileListView = Marionette.CollectionView.extend({ tagName: 'section', className: 'b-list-viewtile', template: '/static/js/app/list/modules/productslist/templates/tileList', childView: ProductsList.TileItemView }); ProductsList.TileItemView = Marionette.ItemView.extend({ tagName: "article", className: "b-list-viewtile__item", template: '/static/js/app/list/modules/productslist/templates/tileItem', _getImage: function(){ var _this = this; var img = new Image(); img.src =...

Marionette 2.4.1 Can't Create CollectionView Instance

backbone.js,marionette
I'm having trouble creating an instance of a CollectionView in Marionette 2.4.1. This is a really simple example. Not sure what's going on. Seems like a Marionette bug. var AppointmentModel = Backbone.Model.extend({ }); var AppointmentCollection = Backbone.Collection.extend({ model: AppointmentModel }); var TimeSlotView = Marionette.ItemView.extend({ }); var AppointmentCollectionView = Marionette.CollectionView.extend({ childView:...

Backbone's delegateEvents doesn't bind events until after attached to DOM

javascript,jquery,backbone.js,marionette
I'm working on a chat client, and I've come across an issue with Backbone's event system. When the client starts, I render the view as so: var view = new ServerListView({collection: Chatter.servers}); Chatter.Views.servers = view; $('#channels > ul').html(view.render().el); Works fine, events are called. Speaking of events those are: events: {...

Passing a Marionette Application through requirejs

backbone.js,requirejs,marionette
file structure app | |--scripts | | | |--home | | | | | |--index.js | | |--object.js | | |--router.js | | |--views.js | | | |--app.js | |--main.js How do I get the Router file: router.js require([ 'jquery', 'backbone', 'app', 'marionette'], function($,Backbone,UserAdmin) { return Backbone.Router.extend({ routes:{ "":"showIndex" },...

Do backbone marionette.js parent view bubble down?

javascript,backbone.js,marionette
I reference this question and document I know how to bubble up. But in my situation, I want to bubble down. Just like I click a button on parent view then trigger some function of all my childview. var parent = Marionette.CompositeView.extend({ triggers: { 'click #edit': "??" // trigger the...

CollectionView - collection data not being passed to childView

javascript,backbone.js,marionette
I'm trying to make the collectionView work , but I'm not really sure whether the CollectionView initiates the fetch method automatically and then populates the ChildViews with the fetched data. Or is it something I need to do manually? I have checked the Marionette doc page but I couldn't find...

Marionette CompositeView - change in template each nth items

twitter-bootstrap,backbone.js,marionette,composite-view
I'm using Marionette for a while, but I'm not sure how I can do what I want, in a simple manner. I have a composite view, which renders something like this: <div class="row"> <div class="col-xs-12"> <div id="items"></div> </div> </div> Each of my item is being rendered as a: <div class="col-xs-3">foo</div>...

Backbone/Marionette div wrapper interfering with Select Options

javascript,backbone.js,marionette
I have a Layout view, with a region comprising a select input. //template <div class="col-xs-12"> <select name="type" id="drop" class="select"></select> </div> I have a LayoutView which defines the following region and assigns a collection view to populate the select menu with options. //layout Backbone.Marionette.LayoutView.extend({ regions: {drop: "#drop"}, onRender: function() { this.getRegion("drop").show(new...

Backbone: LayoutView needs to listenTo a ItemView inside a CollectionView

javascript,backbone.js,triggers,marionette
I'm trying to use the listenTo method in Backbone to listen to a trigger that is inside a child view, inside a collection view, and up to the collection views parent LayoutView. From google searches a lot people mentioned to use a library for nested objects in backbone, but I'm...

Backbone.js `model.destroy()` custom transitions?

javascript,jquery,backbone.js,marionette
When I use Backbone's model.destroy(), it seems to automatically remove that view from the DOM. Is there a way for me to use destroy() to send the DELETE request, but remove the view from the DOM myself? Something like: this.model.destroy({ wait: true, success: function(){ $('#myElement').animate({ "height" : "0", 1000, function(){$('#myElement').remove()}...

How can I understand where locate backbone file that extends from plugins?

javascript,backbone.js,coffeescript,marionette
I'm new of Backbone and I wonder: How I can understand where I must locate a file that extends from a plugin ? Example, I want use Backbone.Modal that is a plugin for create easily modals: https://github.com/awkward/backbone.modal In their example they simply do: var Modal = Backbone.Modal.extend({...}) But if I...

Tool tip on Header of Backgrid Table

javascript,backbone.js,marionette,backgrid
I am using backgrid to display a table. I want to show tool tip on header of the table. can any one help?...

Alternative to require our app module each time to debug in console

javascript,requirejs,marionette,grunt-contrib-requirejs
When I want to debug my requirejs app, I need to reference my application everytime with something like: var App = require('app'); as stated here: http://requirejs.org/docs/api.html#modulenotes From that moment I can access everything via console because the App variable points to my application instance.. However, it is very annoying to...

Marionette query string change triggers route event

backbone.js,marionette
If I add new parameters to query string then route change event gets triggered and I don't want that to happen, how can i resolve this? for example I have route '/#register' if I add new parameters like 'name = abc' then route becomes '/#register?name=abc' which is fine but it...

Can't get Marionette Routing to Work

ruby-on-rails,marionette
I can't get Marionette routing to work @Arc = do(Backbone, Marionette) -> App = new Marionette.Application API = listContacts: ()-> console.log "from listContacts" class MyRouter extends Marionette.AppRouter appRoutes: "notes" : "listContacts" controller: API App.router = new MyRouter() App.on 'start', -> console.log "in on start" if Backbone.history Backbone.history.start(pushStart: true) App console.log...

Marionettejs Routes

javascript,backbone.js,marionette,backbone-routing
I'm new to Marionette and I just can't get routes to work. I'm using Marionette's 2.4.1 version, and trying to do it the simplest way possible so it'll just work. This code works for old version of Marionette, v1.0.2, which was included in one of the yeoman's generator. I know...