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

How to render a collection of different Marionette Views

I am trying to render a backbone collection of views. The collection could be any kind of marionette view ( layoutView, CompositeView, collectionView, ItemView). When I try and render, I get “[object Object]” for each view that renders. This leads…
SegFaultDev
  • 455
  • 1
  • 7
  • 24
0
votes
1 answer

Marionette drop in new ItemView after every fetch not working

I am working with an app that after every collection.fetch, I need to drop in a random ad into the DOM. But, every time the collection fetches, and the ad is dropped in, it appears that the DOM is resetting itself instead of just appending new items…
dennismonsewicz
  • 25,132
  • 33
  • 116
  • 189
0
votes
0 answers

Integrate a CollectionView in an ItemView with marionette

I have an app which displays rooms, and for each room it displays reservations for this room. So, I have: My App (BtApp) A RoomsCollectionView which displays RoomView ItemsViews (from a RoomsCollection) Several RoomView which displays Room…
maxime
  • 1,993
  • 3
  • 28
  • 57
0
votes
1 answer

Marionette CompositeView children.findByIndex not working as expected after collection sync

I have the following code that happens after a collection sync: adGeneration: function() { var child = this.children.findByIndex(this.children.length - 1); console.log(child.model.toJSON()); …
dennismonsewicz
  • 25,132
  • 33
  • 116
  • 189
0
votes
1 answer

Marionette Show new element after increment

I am attempting to have a view where after every fetch of 20 different products from my backend (.fetch()), the DOM will display a product ad. The problem I am running into is that every time the collection fires the add event, the CompositeView is…
dennismonsewicz
  • 25,132
  • 33
  • 116
  • 189
0
votes
1 answer

Marionette. Add methods to view via behaviors

So I have: Class MySuperBehavior extends Marionette.Behavior Bunch of classes extends Marionette.ItemView and uses MySuperBehavior, like tralalaView, trololoView etc I want to create method into MySuperBehavior which every instance of TralalaView…
Daydreaming Duck
  • 2,110
  • 3
  • 18
  • 25
0
votes
0 answers

Marionette.js CompositeView won't render Children

Here is my CompositeView: define(["marionette", "lodash", "text!fonts/products/template.html", 'fonts/products/item-view', 'fonts/products/collection', 'fonts/products/model'], function(Marionette, _, templateHTML, ProductItemView,…
dennismonsewicz
  • 25,132
  • 33
  • 116
  • 189
0
votes
0 answers

Messageboard user messages Marionette js

I believe I have a good understanding of Marionette and Backbone, but the following issue has me stumped. I'm trying to display a message board using marionette item views within a collection view, and I have a way that works, but I'm unhappy with…
user1710407
  • 491
  • 1
  • 5
  • 16
0
votes
2 answers

MarionetteJS - cannot reference this in template function

I have a view which is a Marionette ItemView. I would like to access other parameters on this view using "this" inside the template function but I get it as undefined and I'm unsure why. define(['jquery', 'hbs!templates/template', 'backbone'], …
SoluableNonagon
  • 11,541
  • 11
  • 53
  • 98
0
votes
0 answers

Hammer.js events with Marionette.js doesn't work

I'm trying to use Hammer.js with Backbone , Marionette and Require.js When i initialize events , the event is not fired . I use Hammer.js and jQuery.hammer extension I would like to do something like that : edit : events: { "tap .menu ": "…
Sinpatogo
  • 1
  • 1
  • 2
0
votes
2 answers

Marionette + Handlebars without JS

It is possible to render my Marionette / Handlebars templates without JS using Java for older browsers? Thanks
VMOrtega
  • 1,948
  • 3
  • 18
  • 22
0
votes
1 answer

Get a view from its container element

I'm dealing with some poorly planned, poorly written code right now, and I don't have the time to do a rewrite. I need to be able to access a view that is rendered on the same page, but otherwise separate from the view I need to access it…
KthProg
  • 2,050
  • 1
  • 24
  • 32
0
votes
2 answers

How to implement backbone.js validations/custom validations?

Need to validate one field based on the value of other field using backbone validation js. How to approach this ? Is it possible to validate using lib methods like range validator, max validator OR should I go with custom method ?? Normally this is…
0
votes
2 answers

moment.js unable to use in backbone template

I am trying to moment.js function moment().format() inside my backbone template as shown below. <% var x = new Date(start); print(moment().format()) %> it doesn't work. It gives an error Uncaught ReferenceError: moment is not…
Mopparthy Ravindranath
  • 3,014
  • 6
  • 41
  • 78
0
votes
1 answer

Marionette - listenTo a custom event triggered from a collection

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…
Alexus
  • 1,887
  • 1
  • 23
  • 50
1 2 3
99
100