Real-time binding of input field without helper

1

Hello,

I’m hitting a bit of a brick wall here and need a second set of eyes on this.

I have what is basically a multi-form in one of my components. There are an arbitrary number of text fields on the component (dependent on relationships of the component’s parameter).

I am trying to set up an action on focusOut to save the record to the store. However, due to the nature of the component I need to be able to pass which field’s model is affected. The {{input}} helper does not support parameters, and when I tried <input type="text" value={{job.id}} {{action "updateJob" job on="focusOut}}>, accessing job.get(‘id’) in the action returns the initially loaded value, which is incorrect.

To simplify–what would be the best way to either bind the value of the field or pass a parameter to an input helper’s action?

2

Actually the {{input}} helper should do exactly what you need it looks like you tried placing the action in the wrong place.

{{input value=job.id focusOut=updateJob job}}

http://emberjs.com/api/classes/Ember.TextSupport.html

The input type is text by default

3

Unfortunately that won’t work and is semantically if not syntactically the same as what I had originally tried with the input helper: {{input value=job.id action="updateJob" on="focus-out"}}. There’s still no way to pass the attribute; the code you provided fails to build. I need to be able to pass the actual record in addition to the value in the field, so that I can tell the store which values to save/push.

4

I see what your saying: EmberJS Simple data binding example - JSFiddle - Code Playground

why not hold it in a property, and run an observer it will automatically have the binding.

5

If it were just one field, that would be perfect, but each instance of the component has an arbitrary number of jobs based on it’s parent.

I’m starting to think I need to break this down further and have a discrete separate component for each job. It seems overkill for one text field but I think that may be my best option.

6

Check out this addon: https://github.com/jayphelps/ember-computed-content-controller

It came in handy when I had to iterate over an each.