How to call submit on an input form?

1

Hi everyone,

I’ve build a todo-list with a Rails-API. I’ve followed a tutorial, even if it was deprecated, by following the guides and others resources, I’ve succeed most steps.

However, since yesterday, I can’t understand what’s wrong in my code :

app/templates/application.hbs 

<h1> ToDo App </h1>

{{input type="text" id="new-todo" value=newTitle placeholder="what's need to be done?" action="createTodo"}}

here’s my app/controllers/todos.js

import Controller from '@ember/controller';

export default Controller.extend({
  actions: {
    createTodo(){
      this.store.createRecord('todo', {
        title: this.get('newTitle'),
        isCompleted: false
      });
    }
  }
});

So, I want a user to write his todo and to generate the create action when the user leave the input or when he press ‘enter’.

Maybe, i’m doing it wrong, I didn’t succeed to find any recent tutorials on this subject.

2 
= input keyDown=(action "onKeydownHandler") focusOut=(action "createTodo")
...
onKeydownHandler(event) {
  if (event.keyCode === 13) {
    this.send('createTodo');
  }
}
3

Hi Nik, thanks for you answer !

I’ve understand the onKeydownHandler however I dont understand the input.

Should it looks like something like this {{input type="text" id="new-todo" value=newTitle placeholder="smth" focusOut=(action "createTodo") keyDown=(action "onKeydownHandler")}} ?

4

Yes. I got used to Emblem, so wrote without thinking about handlebars syntax.

5

You should still use <form> tags and put the submit action there. That’ll take care of hitting [Enter] but the leaving focus would need a different solution.