charleetm
charleetm

Reputation: 906

Emberjs. How to grab clicked related data?

Am new in emberjs and I am trying to copy a practice using solely jquery. I cannot seem to able to do it. Maybe I should approche the following in a different way?

I have a view:

{{#each clip}}
    <div class="large-3 columns">
       <div {{action panel_clicked uuid}} class="panel" style="overflow:hidden; height:200px;">
            {{view Ember.TextField valueBinding="notes" type='hidden'}}
            {{view Ember.TextField valueBinding="uuid" type='hidden'}}
            {{{chunk}}}
        </div>
     </div>
 {{/each}}

What I want to do is when I click on the class='panel' I get the uuid and use that to get the hidden text fields.

Usually I will just have a custom id for the hidden field such as id='notes_[uuid]' so in jquery I can just do something like $('#notes_' + uuid).val() However I haven't figure out a way to generate a dynamic id in the Ember.TextField.

So is there a way to dynamically generate id in Ember.TextField or I should think bout it differently?

Thanks

Upvotes: 1

Views: 69

Answers (2)

spullen
spullen

Reputation: 3317

You could just pass in the object to the action.

{{#each clip}}
  <div {{action panel_clicked this on="click"}} class"panel">
  ...
  </div>
{{/each}}

Where this refers to the current object in the each loop.

Then your action would just take the object as a parameter:

panel_clicked: function(clip) {
  alert(clip.get('someAttr')); // just to show it works
  ... // what you want to do
}

Check out the documentation as well.

Upvotes: 1

buuda
buuda

Reputation: 1427

Clicking on a view will generate a 'click' event on that view. The event.context will be the model bound to that view.

App.ActionPanelView = Ember.View.extend({
  click: function(evt) {
    var model = evt.context;
    ....
  }
});

{{#each clip}}
    {{view App.ActionPanelView valueBinding=clip}}
{{/each}}

Ember should maintain all the bindings. If you ever find yourself

Upvotes: 1

Related Questions