Ember Form Submission

1

I am trying to implement a payment module in ember. I have created a form and on the form action have assigned the server address to which form will be submitted

<form action="https://api.mondido.com/en/v1/transactions" id="payment_form">

In simple jquery I am supposed to do something like this

var onSuccess = function(transaction){
    alert(transaction.id);
};
var onError = function(error){
    alert(error.description);
}
$('#my_form').mondido({type:"ajax", success:onSuccess, error:onError});

But I want to wrap it around in some action in the controller. The problem is when I do something like this

<form action="https://api.mondido.com/en/v1/transactions" id="payment_form" action{{someFunction on="submit"}}>

the action is being called twice. I have to click on the submit button twice to get it going in the first attempt and then it is being submitted twice.

Any thoughts how to go around with it?

2

Have you tried to removing action from your form?

<form id="payment_form" {{action "processAPI" on="submit"}}>
  <button type="submit">Submit</button>
</form>

App.IndexRoute = Ember.Route.extend({
  actions: {
    processAPI: function () {
      // Do your AJAX here
    },
  },
});

Here is a JSBin.

1 Like