This.get('property') undefined because component

@hschillig wrote:

So in my controller, I have an action when the user submits a form. It has code like this in it:

this.get('propertyName')

However this returns undefined because the form is inside a component so it's out of the scope. My controller points to this view:

{{#popup/popup-modal title='New Contract' identifier='addContractModal' redirect='contracts' rules=rules model=model}}
  {{#validated-form rules=rules model=model}}
    {{partial "forms/contract"}}

    <div class="text-right">
      <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
      <button {{action "create"}} class="btn btn-primary">Create</button>
    </div>
  {{/validated-form}}
{{/popup/popup-modal}}

So I have a component for popup modals and then validated forms (so I can perform validation on a form). They are all reusable components.. but now inside the form, I have code like this:

{{input value=model.fname name='fname' class='form-control' id='fname'}}

fname is there.. but it doesn't get updated on the controller because it's inside a component.. when this is out of the component and straight in the view, it updates on the controller. Now I know I could pass fname=fname into the two components, but for each property? That's going to look horrendous.

How do I make sure all properties are being passed down into these components? The components won't know the names of these properties so I can't just detect a change in the component on the property name..

I never knew how to do this.. and it's starting to get me stuck on a lot of areas in the application I'm developing.

Thank you for any help/suggestions.

Posts: 2

Participants: 1

Read full topic