javascript - Use select element to control ember views -

i have select form element 3 options, , next button. when next button clicked should @ users selection , show new form.

the current code not giving me desired results when form element on change fired.

i don't think using if blocks proper way achieve this.

is there alternate show/hide method use handle form elements on change?

here simple proof of concept in jquery, 1 bypasses submit btn.

http://jsfiddle.net/dfyas/

hbr code

<div> <label>pick form?</label> {{view "select" content=myforms class="formsel"}} </div>  <div>     <a {{action 'showform'}}role="button">next</a> </div> </form>    {{#if showform1}}     <form>see form 1</form>   {{/if}}    {{#if showform2}}     <form>see form 2</form>   {{/if}}    {{#if showform3}}     <form>see form 3</form>   {{/if}} 

ember code

myforms: ['1', '2', '3'], showform1: false, showform2: false, showform3: false,  actions: {   var formsel = $('.formsel');     showform: function() {       var showform1 = this.get('formsel.val()', []) == 1;       var showform2 = this.get('formsel.val()', []) == 2;       var showform3 = this.get('formsel.val()', []) == 3;     } } 

the handlebars {{#if}} helper purely true/false - i.e. pass value - doesn't support comparisons, equality. either set 3 variables pass {{#if}}s:

hbr

<div>     <label>pick form?</label>     {{view "select" content=myforms}} </div>  <div>     <a {{action 'showform'}}role="button">next</a> </div> </form>  {{#if showform1}}   <form>see form 1 </form> {{/if}}  {{#if showform2}}   <form>see form 2</form> {{/if}}  {{#if showform3}}   <form>see form 3</form> {{/if}} 

ember.js

myforms: ['1', '2', '3'], actions: {     showform: function() {         var showform1 = this.get('myforms.val()', []) == 1;         var showform2 = this.get('myforms.val()', []) == 2;         var showform3 = this.get('myforms.val()', []) == 3;         console.log(this.get(holdingsvalue));     } } 

or if need large number of forms, write/steal helper supports comparison operators