In this example, I will shred how to handle form submission in ember.js? The example shows a form (just conceptually, as there is no HTML form element) to enter a first and last name. The entered values are synced to the model and you can can “perform a submit”.
The JS code:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
App = Ember.Application.create({}); App.Person = Ember.Object.extend({ firstName : "", lastName : "" }); App.IndexRoute = Ember.Route.extend({ model: function(){ return App.Person.create() }, setupController : function(controller, model){ controller.set("model", model); } }); App.IndexController = Ember.ObjectController.extend({ submitAction : function(){ // here you could perform your actions like persisting to the server or so alert("now we can submit the model:" + this.get("model")); } }); |
The template showing the use of value bindings:
|
1 2 3 4 5 6 7 |
<script type="text/x-handlebars" data-template-name="index"> <h2>Index Content:</h2> {{input valueBinding="model.firstName"}} {{input valueBinding="model.lastName"}} <button {{action submitAction target="controller"}}>Pseudo Submit</button> <p>{{model.firstName}} - {{model.lastName}}</p> </script> |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.