Monday 26 August 2013

How to position a modal relative to clicked action in ember.js

How to position a modal relative to clicked action in ember.js

I have a emberjs application where a person can:
click a link modal pops up change something click away modal save changes
I created the modal much like described here, with events on a route. I
can parse ember object into the route but I cannot seem to get the clicked
DOM element. I want to get the clicked DOM element because I need its
position. I want to position a popup relative to the clicked DOM element.
my action in .hbs file looks like:
<a {{action open option}} class='choose-template'>Choose Template</a>
and this action is handled by a route
events: {
open: function(option) {
this.controller.set('field_option', option);
this.render('modal', // the view to render
{
into: 'application', // the template to render into
outlet: 'modal' // the name of the outlet in that template
}
);
},
close: function() {
this.render('nothing',
{ into: 'application', outlet: 'modal' });
}
}
I handle the model positioning in App.ModalView.didInsertElement(). Here I
want to use the link DOM elment to make the modal position itself relative
to the clicked link.

No comments:

Post a Comment