Comments on: Managing A Modal Dialog With Backbone And Marionette http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/ Better Than Yesterday Mon, 20 May 2013 17:13:00 +0000 hourly 1 http://wordpress.org/?v=3.4.2 By: ivan http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/#comment-3170 ivan Sat, 30 Mar 2013 21:02:00 +0000 http://lostechies.com/derickbailey/?p=891#comment-3170 this is way too much code... what is the benefit of doing bootstrap modals this way? this is way too much code… what is the benefit of doing bootstrap modals this way?

]]> By: Andrew http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/#comment-3138 Andrew Thu, 21 Mar 2013 14:13:00 +0000 http://lostechies.com/derickbailey/?p=891#comment-3138 Thanks for the image. Not sure what my problem is. After seeing the image I looked at the page source and it had the code that was in the image. Thanks again, Andrew Thanks for the image. Not sure what my problem is. After seeing the image I looked at the page source and it had the code that was in the image.

Thanks again,

Andrew

]]> By: Derick Bailey http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/#comment-3137 Derick Bailey Thu, 21 Mar 2013 13:08:00 +0000 http://lostechies.com/derickbailey/?p=891#comment-3137 The code examples are hosted by github gists. Is it possible that your firewall is preventing the gist from loading? or perhaps another network issue is preventing it? Here's a screenshot of what I see in that section of the post: http://cl.ly/image/0e2n3c112g1h The code examples are hosted by github gists. Is it possible that your firewall is preventing the gist from loading? or perhaps another network issue is preventing it? Here’s a screenshot of what I see in that section of the post: http://cl.ly/image/0e2n3c112g1h

]]> By: andrew http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/#comment-3136 andrew Thu, 21 Mar 2013 13:04:00 +0000 http://lostechies.com/derickbailey/?p=891#comment-3136 Hey Derick, Is this article missing the code? I see: " I will supply the content for the modal through a Backbone view, which looks like this: How easy is that?" Shouldn't there be code between "which looks like this:" <code> and "How easy is that?" Thanks Andrew Hey Derick,

Is this article missing the code? I see:

” I will supply the content for the modal through a Backbone view, which looks like this:

How easy is that?”

Shouldn’t there be code between “which looks like this:” and "How easy is that?"

Thanks Andrew

]]> By: tonthon http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/#comment-3107 tonthon Mon, 11 Mar 2013 10:17:00 +0000 http://lostechies.com/derickbailey/?p=891#comment-3107 Since I struggled quite a lot to get it work fine with jquery dialog, I end up with sharing my code. Combining the following region with a view implementing onBeforeClose and onClose methods, I'm able to handle the most use cases. Hope this can help var Popup = Backbone.Marionette.Region.extend({ el: "#modal", title:"My title", constructor:function(){ _.bindAll(this); Backbone.Marionette.Region.prototype.constructor.apply(this, arguments); }, getEl: function(selector){ var $el = $(selector); return $el; }, onShow: function(view){ var this_ = this; view.on("close", this.closeModal, this); this.$el.dialog({ resize:'auto', modal:true, width:"auto", height:"auto", title:this_.title, hide: "fadeOut", close:function(event, ui){ this_.close(); } }); }, closeModal: function(){ if (this.$el.dialog("isOpen")){ this.$el.dialog("close"); } } }); Since I struggled quite a lot to get it work fine with jquery dialog, I end up with sharing my code. Combining the following region with a view implementing onBeforeClose and onClose methods, I’m able to handle the most use cases.
Hope this can help

var Popup = Backbone.Marionette.Region.extend({
el: “#modal”,
title:”My title”,
constructor:function(){
_.bindAll(this);
Backbone.Marionette.Region.prototype.constructor.apply(this, arguments);
},
getEl: function(selector){
var $el = $(selector);
return $el;
},
onShow: function(view){
var this_ = this;
view.on(“close”, this.closeModal, this);
this.$el.dialog({
resize:’auto’,
modal:true,
width:”auto”,
height:”auto”,
title:this_.title,
hide: “fadeOut”,
close:function(event, ui){
this_.close();
}
});
},
closeModal: function(){
if (this.$el.dialog(“isOpen”)){
this.$el.dialog(“close”);
}
}
});

]]> By: AP Fritts http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/#comment-2973 AP Fritts Wed, 09 Jan 2013 02:12:00 +0000 http://lostechies.com/derickbailey/?p=891#comment-2973 Technically, when you click off or close a modal, it just hides it...it doesn't close the Backbone Marionette View. The view is automatically closed for you the next time you show a modal but it might be a little cleaner to close the modal so that any events associated with it don't accidentally fire .... which probably indicates another problem in the code but better be safe than sorry? Technically, when you click off or close a modal, it just hides it…it doesn’t close the Backbone Marionette View. The view is automatically closed for you the next time you show a modal but it might be a little cleaner to close the modal so that any events associated with it don’t accidentally fire …. which probably indicates another problem in the code but better be safe than sorry?

]]> By: AP Fritts http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/#comment-2972 AP Fritts Wed, 09 Jan 2013 01:59:00 +0000 http://lostechies.com/derickbailey/?p=891#comment-2972 If you run into a problem with the modal hiding on the page and not up front, try adding: class="modal hide fade" To the #modal div. If you run into a problem with the modal hiding on the page and not up front, try adding:

class=”modal hide fade”

To the #modal div.

]]> By: tonthon http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/#comment-2958 tonthon Mon, 31 Dec 2012 13:05:00 +0000 http://lostechies.com/derickbailey/?p=891#comment-2958 I tried the provided example with the jquery simplemodal plugin, but I had to add a call to the getEl method after closing the modal dialog (overriding the ensureEl method was another way to come to the same solution). I tried the provided example with the jquery simplemodal plugin, but I had to add a call to the getEl method after closing the modal dialog (overriding the ensureEl method was another way to come to the same solution).

]]> By: Ahmad Khatib http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/#comment-2846 Ahmad Khatib Mon, 19 Nov 2012 19:49:00 +0000 http://lostechies.com/derickbailey/?p=891#comment-2846 Just upgraded from 0.1 to 1.0-beta5 and had to make this change as well. Just upgraded from 0.1 to 1.0-beta5 and had to make this change as well.

]]> By: Luca Canducci http://lostechies.com/derickbailey/2012/04/17/managing-a-modal-dialog-with-backbone-and-marionette/#comment-2828 Luca Canducci Mon, 05 Nov 2012 17:53:00 +0000 http://lostechies.com/derickbailey/?p=891#comment-2828 Great article, thanks! For me it worked changing this line: this.on("view:show", this.showModal, this); into this: this.on("show", this.showModal, this); Does it make any sense to you? Great article, thanks!

For me it worked changing this line:
this.on(“view:show”, this.showModal, this);
into this:
this.on(“show”, this.showModal, this);

Does it make any sense to you?

]]>