how emberjs get form values in a object? - ember.js

Question

templates/module.hbs
<form class="" method="post" {{ action "step1" on="submit"}}>
{{input type="email" value=email}}
{{input type="checkbox" checked=permission}}
{{input type="submit" value="next"}}
</form>
how can i reach email and checkbox value in a object (like model.email and model checkbox ) in Route
routes/module.js
export default Ember.Route.extend({
model() {
return this.store.createRecord('wizard');
},
actions: {
step1(){
alert(this.controller.get('model.email')); // returns undefined
// get form values like model.email model.checkbox
},
}
models/wizard.js
export default DS.Model.extend({
email: DS.attr('string'),
permission: DS.attr('boolean')
});
Update: [[ alerts returns undefined ]]

Answer 1

First you will have to create model. let's say you are working on model user
//routes/module.js
export default Ember.Route.extend({
model() {
return this.store.createRecord('wizard');
},
actions: {
step1(){
this.controller.get('model.email')// you will get email value here.
// get form values like model.email model.checkbox
}
}
then in template you have to use in the same format
//templates/module.hbs
<form class="" method="post" {{ action "step1" on="submit"}}>
{{input type="email" value=model.email}}
{{input type="checkbox" checked=permission}}
{{input type="submit" value="next"}}
</form>

Answer 2

In case you do not want to use a model for the simplest request, you can use jQuery's serialize method.
btnQueryClicked() {
const $form = $('.bar-query-query');
const params = $form.serializeArray();
// convert parameters to dictionary
const paramsDict = {};
params.forEach((param) => {
paramsDict[param['name']] = param['value'];
});
$.post('/query', paramsDict)
.done((data) => {
console.log(data);
});
},
Code above is what I use to make a simplest query request for data display purpose only. (It is not that elegent but you get the idea)
It is too heavy to me to create a model only for a simple request which does not need to be persistent anyway.