Questions tagged [marionette]

Backbone.Marionette is a composite application library for Backbone.js that aims to simplify the construction of large scale JavaScript applications. Do NOT use this tag for Firefox's Marionette driver. Use the firefox-marionette tag instead.

Backbone.Marionette is a collection of common design and implementation patterns found in the applications that we have been building with Backbone, and includes pieces inspired by composite application architectures, event-driven architectures, messaging architectures, and more.

Important to note that Marionette introduced some breaking changes in their API when moving from 1.X to 2.X below is a quick summary of the main breaking changes that can cause errors in your app, a full report on the changes can be found on google docs.

General

  • All instances of the word type in the API have been replaced with the word class. For instance:
    • regionType => regionClass
    • ChildViewType => ChildViewClass

Applications and Modules

  • Application’s initialize triggerMethods have been renamed to start, which is more descriptive of what is actually happening. More specifically, initialize:before and initialize:after are now before:start and start, respectively. Note that no functionality has been lost with this change; it is merely a changing of names.

Controllers

  • close has been renamed to destroy to emphasize the fact that an instance should not be reused, or ‘opened,’ after it is destroyed

Regions

  • Regions now expose region.el and region.$el, just like View’s. Due to this change if you were depending on region.el to be a string selector you must update your code to use region.$el.selector.

  • The open method has been renamed to attachHtml

Views

  • Layout is now called LayoutView
  • Renamed close to destroy for views. Close was a confusing verb for users who thought that they could be reopened. The verb destroy makes it more clear that once a view is destroyed you can not reuse it.
  • Returning false from onBeforeClose no longer prevents the view from closing
  • appendHtml has been renamed to attachHtml.
  • appendBuffer has been renamed to attachBuffer
  • Removes duplicate and inconsistent itemView events. No functionality was lost with this change; simply use the unprefixed version instead. For instance, use before:render instead of item:before:render
  • childEvents callbacks no longer receives the event name as the first argument
  • itemView within a collectionView is now known as childView. This removes confusion for new users as to the fact that you can show any type of view in your collectionView.
  • All CollectionView methods that referenced itemView now use the same childView as well. For instance, getItemView is now getChildView. Do note that CompositeViews extend from CollectionView, so these API changes affect that Class as well.

References

2383 questions
0
votes
1 answer

Marionette CompositeView undelegating childview events on setElement

I have a marionette compositeview which I am using to create a item list for a profile page on an app. For the child view, I extend from an already existing ItemView. When I use this.setElement(this.el.innerHTML) in the compositeview onRender…
hyprstack
  • 4,043
  • 6
  • 46
  • 89
0
votes
1 answer

How to reference a Backbone/Marionette View within itself?

MyView.js: define(['app/models/MyModel'], function (MyModel) { return Mn.LayoutView.extend({ template: '#my-template', className: 'my-classname', regions: { content: '.content-region', …
0
votes
0 answers

Can't access pre-compiled handlebars template by gulp-handlebars within Marionette Layout View

While I have no problems on a Mac, this problem occurred after I cloned the project into a Windows machine. All the gulp tasks run without a problem, however I get a "Uncaught UndefinedTemplateError: Cannot render the template since it is null or…
Ayberk
  • 50
  • 11
0
votes
1 answer

requirejs / backbone : declare a global function / variable

Is it possible to declare a global function in a backbone / marionnette app, that calls a precise module's function? This question may sound weird since I personally would suggest not to do this at all, because using modules is awesome and keep app…
Simmoniz
  • 1,080
  • 15
  • 27
0
votes
0 answers

Using Masonry with Marionette & Backbone

I am trying to get Masonry to work properly in my app and it is just not working the way I would like it to. Nothing is aligning properly in Masonry (big gaps are being left everywhere). I load a bunch of divs into a region. There is infinite…
tommybond
  • 650
  • 6
  • 19
0
votes
1 answer

How to organize Marionette projects between production and dev?

My question is simple. Imagine that you have a project built with marionette/backbone and you have two target medias: mobile and desktop. There is a backing server, written in DJango (or Ruby, or etc.). How can I organize the project, so I can…
George Silva
  • 3,454
  • 10
  • 39
  • 64
0
votes
1 answer

Backbone.blazer routing with parameters

I use Backbone.Blazer plugin for my app routing. But i can't pass route parameters to the Route constructor. How can it be done? var AppRouter = Backbone.Blazer.Router.extend({ routes: { '': new HomeRoute(), 'accounts/:id': new…
betmakh
  • 435
  • 4
  • 8
0
votes
1 answer

how to use collection and other model simultaneously for list type template in marionette + rails

I hope to know how to use collection and model simultaneously in Backbone Marionette + Rails. Currently, my template jst.eco has below format.

Samuel Jansson
  • 329
  • 1
  • 3
  • 13

0
votes
1 answer

What's the preferred way to go about using backbone with non-crud resources?

New to backbone/marionette, but I believe that I understand how to use backbone when dealing with CRUD/REST; however, consider something like results from a search query. How should one model this? Of course the results likely relate to some…
Steve P.
  • 14,489
  • 8
  • 42
  • 72
0
votes
1 answer

Route to backbone same route

I have the route 'availability/exceptions' which routes to the function availabilityExceptions and which works fine: return Backbone.Marionette.AppRouter.extend({ appRoutes: { 'availability/exceptions(/:key1)(/:value1)':…
Mark
  • 4,428
  • 14
  • 60
  • 116
0
votes
0 answers

Marionette CompositeView not responding to changes in collection

I'm trying to create a customized todo list, loosely based on the Backbone todoMVC tutorial app. I've created a CompositeView that shows a collection using separate ItemViews. My understanding is that whenever a new model is added to the…
zdestiny
  • 542
  • 3
  • 10
0
votes
1 answer

How does Mustache populate the variable inside the curly braces in template?

I'm debugging a big Backbone Marionette application and I'm very new to it. It's also using MustacheJS which I just heard today. I found the template file which has the filename UserProfile.mst // This is UserProfile.mst
devwannabe
  • 3,160
  • 8
  • 42
  • 79
0
votes
2 answers

When to use jQuery-ui plugin vs Backbone View?

I'm confused by the "componentization" of the web UI. If I have a need for a component, should I write my own jquery-ui plugin or should I write, if I use Backbone.Marionette, a MarionetteComponent ? Both are be reusable, isolated unit of view and…
bdavidxyz
  • 2,492
  • 1
  • 20
  • 40
0
votes
1 answer

Marionette JST template rendering

I'm trying to get Marionette render my JST templates, working in Rails environment. According to the tutorial and Marionette official documentation I have to override Marionette render methods: Backbone.Marionette.Renderer.render = (template, data)…
curious_gudleif
  • 572
  • 1
  • 4
  • 19
0
votes
1 answer

Setting a variable in Backbone Marionette app

I'd like to assign a value to a variable like "down" when network connectivity is lost. However, I'm not sure where and how to set the variable in Backbone so that it is accessible from any view or model. I'm new to Backbone and Marionette. This…
devwannabe
  • 3,160
  • 8
  • 42
  • 79