Accessing properties of input helpers on form

1

i’m trying to create a new book in my database, but my layout is very different, i don’t have a button submit in my form, he is outside, like:

<form>
 <label>Name</label>
 {{input value=book.name}}
</form>

<button>Create</button>

So… i’m trying like this:

I’m returning a object in my routes/books/new.js:

export default Ember.Route.extend(AuthenticatedRouteMixin, {
  model () {
    return {
      name: 'test',
    };
  },

  setupController (controller, model) {
    controller.set('book', model);
  }
});

And in my button i have the action save. So, when someone clicks, in my controller/books.js i have:

actions: {
 save () {
   console.log(this.get('book');
 }
}

And this is returning undefined.

2

Hey @celo you’re pretty close. I think it is because you’re passing in the value as book.name when you want to pass in just something like bookName or just book which is what you are expecting in your controller.

I’ve put together a twiddle for you to have a look at Ember Twiddle (hmmm twiddle is giving me problems today. If it doesn’t load here it is in a gist https://gist.github.com/michaellee/55ec3323b2df76aa4278)

I think it is fine if the button is outside of the form, but don’t forget to pass in the {{action "actionName"}} to the button element.

In the twiddle above, I’ve put the button inside the form and binded the action to the form so that you get the added benefit of if the user hits return after they fill in the field then the action will still trigger.

3

Hei Michaelle, thanks for your reply.

Hm… i didn’t get, In your example, you are defining the form in the main template, in my case i’m defining in the main.new template.

If i put my form in the main template i can access the attributes, but if i use the form in a nested template, i can’t access the attributes, will just print undefined.

Thanks.

4

Sorry if I confused you. I just used the files provided by twiddle to do a quick demo.

So if you’ve got your form in templates/books/new.hbs then the controller would be controllers/books/new.js that would handle your action.

5

REALLY?? I need a controller to my new template??? I didn’t know that :OOOOO… But… that’s too many controllers hahhaa…

But i have a problem i think…

I kindle have a save button generic for all my nested routes… so, if i click in save, this will fire up the action in the controllers/books.js, not in the controllers/books/new.js, right?