1

I want to add data-value attribute in input element:

{{input type="text" data-value=ec.ec_id  value=ec.ecl_subject placeholder=ec.ecl_en_subject name="ecl_subject"  class="form-control" }} 

But its not visible in browser:

<input id="ember874" class="ember-view ember-text-field form-control" placeholder="Doctor4US: Appointment" type="text" name="ecl_subject">
1
  • 1
    Ember not allowed unknown attributes
    – user3560410
    Jul 7, 2016 at 7:47

2 Answers 2

1

ADDING DATA ATTRIBUTES

By default, view helpers do not accept data attributes

i.e.

{{input type="text" data-value=ec.ec_id  value=ec.ecl_subject name="ecl_subject" }}

Render as

<input id="ember257" class="ember-view ember-text-field" type="text" value="12">

There are two ways to enable support for data attributes. One way would be to add an attribute binding on the view, e.g. Ember.TextField for the specific attribute:

Ember.TextField.reopen({
  attributeBindings: ['data-value']
});

Now the same handlebars code above renders the following HTML:

<input id="ember259" class="ember-view ember-text-field" 
       type="text" data-value="110" value="12">

You can also automatically bind data attributes on the base view with the following:

Ember.View.reopen({
  init: function() {
    this._super();
    var self = this;

    // bind attributes beginning with 'data-'
    Em.keys(this).forEach(function(key) {
      if (key.substr(0, 5) === 'data-') {
        self.get('attributeBindings').pushObject(key);
      }
    });
  }
});

For more detail reffer:https://guides.emberjs.com/v1.10.0/templates/binding-element-attributes/

0

Ember Input helpers doesn't allow data-attributes. The list of allowed attributes can be found at https://guides.emberjs.com/v2.6.0/templates/input-helpers/

The solution for problem is that you use html tag itself, when you want to place data-attributes like below

<input type="text" data-value="{{ec.ec_id}}" value="{{ec.ecl_subject}}" placeholder="{{ec.ecl_en_subject}}" name="ecl_subject" class="form-control/>
3

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.