CODEWITHSUNDEEP
javascriptjqueryember.js
Nadine Schmuck
Nadine Schmuck

Reputation: 79

Ember.js Form Instant Submit

After I placed the action inside the form tag (<form {{action 'registerAccount'}}>) I observed that the form is always submitted if the current input field looses focus.

If it is intended behaviour, how can I avoid this?

App.AccountRegisterController = Ember.ObjectController.extend({
    title: 'Registrieren',
    content: [],

    actions: {
        registerAccount: function () {
            var newAccount = this.get('store').createRecord('account', {
                email: this.get('email'),
                password: this.get('password'),
                isNewsletterSubscribed: this.get('isNewsletterSubscribed')
            });
            newAccount.save();
        }
    }
});

enter image description here

Edit:

My bad. Replace the previously mentioned action helper with this:

<form {{action 'registerAccount' on='submit'}}>

Upvotes: 1

Views: 172

Answers (2)

melc
melc

Reputation: 11671

By adding <form {{action 'registerAccount'}}> , the registerAccount function will be called for every click inside your form e.g. when clicking inside the input fields to enter text.

By specifying the DOM event type submit by using the on property, the registerAccount function should be called for click events of type submit, meaning only for input of type=submit or button elements which are of type=submit by default.

It will assist if you can please post your handlebars template of AccountRegisterView.

I would suggest to place your {{action}} helper inside your button element i.e.

<button {{action 'registerAccount'}}>submit form</button>

Then your form submition will only take place when you click the button.

Unless it is something else you want to achieve.

Upvotes: 2

Nadine Schmuck
Nadine Schmuck

Reputation: 79

My bad. Replace the previously mentioned action helper with this:

<form {{action 'registerAccount' on='submit'}}>

Upvotes: 1

Related Questions