Add accept="image/*" attribute to input field in ExtJs

Question

I want to add client side validation for file upload using HTML5 "accept" attribute and ExtJs "inputAttrTpl" config. My ExtJs code is following (ExtJs 4.1):

{
              xtype : 'filefield',
              action : 'upload',
              name : 'file',
              inputAttrTpl: 'accept="image/*"',
              hideLabel : true,
              buttonOnly : true,
              anchor : '100%',
              buttonText : 'Upload img...',
              margin: 5
}

But when I am checking file field in firebug, it doesn't contain "accept" attribute. Can you suggest some solutions for this issue? Thanks for your replies.

Answer 1

{
  xtype:'filefield',
  listeners:{
    afterrender:function(cmp){
      cmp.fileInputEl.set({
        accept:'audio/*'
      });
    }
  }
}

You can set accept to "" to remove the restriction.

Fiddle