TagName Input not displayed in my ember View

Design
1

I want my ember view displaying the result of the total calculation in an input in order to get the value binding of the result.

Everything works fine a part from that i can not get the result inside my Input number

This is my view

App.TotalView = Ember.View.extend({
 tagName: 'input',
 templateName:"total",
 attributeBindings: ['value', 'placeholder'],
 placeholder: null,
 value: '',
 total: (function() {
    var res= parseInt(this.get('controller.newThread.selectContentTariffa')) * parseInt(this.get('controller.newThread.primary'));
   return isNaN(res)?"":res;
    }).property('controller.newThread.selectContentTariffa', 'controller.newThread.primary')
});

This is my html

  <script type="text/x-handlebars" data-template-name="total">
    {{view.total}}
  </script>

Why the result is displayed out of the input?

I have reproduced the issue here: http://emberjs.jsbin.com/piqihi/edit?html,js

2

Input is a self closing tag without block level contents, what you want to do is set the value property to total, not output the total inside the input tags in your template. Removing the {{view.total}} from your template and changing the attributeBinding to the following fixes your issue. However you probably could just use the built in input helper Ember - 4.6 - Ember API Documentation.

 attributeBindings: ['total:value', 'placeholder'],
1 Like