Question

I’m trying to add a template after an element in Ember.js but seems like appending is the only option right now. I’m using jQuery to traverse up to a clicked’s element’s parent then want to add the template after the parent.

Navigating like this: $(this).closest("li").after()

But Ember.js’s appendTo don’t work since I can only add the template inside the parent li.

I came across this pull request: https://github.com/emberjs/ember.js/pull/627 which would implement an insertAfter() method but since this is not in the main branch I was wondering if there’s any other way to do this?

Thanks,

G

Answer 1

I found a solution. Not sure it’s the best approach but it works. I basically add the template somewhere arbitrarily (in this case right after the link that is clicked) then after the element is inserted I move it using jQuery using $():

$(".commentReplyLink").live("click", function(){

    var new_reply_template = Ember.View.create({
      templateName: 'new_reply_template',
      didInsertElement: function() {
        this.$().closest("li").after(this.$());
      }
    });

    new_reply_template.appendTo($(this).after());

});

Here’s a working example: http://jsfiddle.net/givp/tnQJf/28/