Question

Is it possible to set a Ext JS component property (visibility, value, …) to a specific value, smilar to jQuerys [.attr(attributeName, value)][1]?

I’m getting the component name, the property/attribute name and the value and have to update the UI.
My first solution works with a ‘dictionary’ (yes, i’m a c# developer) which calls the right method for the given attribute and supports visibility, value, enabled.

var methodMapper = {
  "visibility" : function(comp, value) {
    if(value == "true" || value == "on" || value == "1" || value == "visible")
      comp.show();
    else
      comp.hide();
  },
  "value" : function(comp, value) {
     comp.setValue(value);
  },
  "enable" : function(comp, value) {
    if(value == "true" || value == "on" || value == "1" || value == "visible")
      comp.enable();
    else
      comp.disable();
  }
};

function receiveMessage(element, property, value) {
  var func = methodMapper[property];
  if(!func) return;
  var comp = Ext.getCmp(element); // retrieve component
  func(comp, value); // set property to value
}

Is there any better solution for setting the property in a component? I want to extend the supported properties to width, height, draggable, … .

Answer 1

@Robar

If you want to work at the attributes of an HTML element, its better that you call getEl() method on your ExtJS component (say panel) to get the element associated with the component and then you can get/set the attributes like how you do it in jQuery because in some cases you may not be able to map the attribute to a component property or method.