Real-time binding of input field without helper



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={{}} {{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?


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

{{input focusOut=updateJob job}}

The input type is text by default


Unfortunately that won’t work and is semantically if not syntactically the same as what I had originally tried with the input helper: {{input 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.


I see what your saying:

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


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.


Check out this addon:

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