PDA

View Full Version : Disable Mask CSS not working in IE



AJAIN32
24 Jun 2015, 11:31 AM
Hi,

I am trying to disable a grid and overriding the .x-mask css to make it look like enabled grid, I dont want to make any user interaction.

I disabled the grid and applied a css at run time like -

grid.addCls(grid-disabled);

.grid-disabled .x-mask {
opacity : 0 !important;
filter : alpha(opacity = 0);
zoom : 1;
}

Everything is working fine in Google Chrome, grid is looking like "not disabled" and there is no functionality as well. But in IE i tried its not appearing as expected.

Any suggestion ?? i want to disable the grid and want to remove the mask css effect in order to look it like enabled grid.

Thanks,
Ankit

tristan.lee
25 Jun 2015, 9:32 AM
What version of IE have you tried? This appears to work:

pfc

AJAIN32
25 Jun 2015, 9:45 AM
Thanks Tristan for replying,

I tried the same fiddle in IE and the grid is greyed out, its not appearing as it appears in google crome. I am using IE 9 in my machine.

Please try the same fiddle in IE, it is greyed out when disabled even after applying the css.

Thanks,
Ankit

tristan.lee
26 Jun 2015, 8:10 AM
I don't think this has to do with the mask CSS, but rather the disabled attribute applied to the element in IE9. This is what's causing the grayed-out look for that version.

You might try removing that attribute from the element once it has been applied, but I am not sure what else that would affect.

AJAIN32
26 Jun 2015, 8:17 AM
Thanks,

So do you mean by disabledCls ?, i tried overriding that too but doesn't find any elements that is causing the greyed out appearance. and its working in crome as well.

In IE when i see the html attributes it shows the mask css applied to the div of the disabled component. any idea/sample to do that ?

Thanks,
Ankit

tristan.lee
26 Jun 2015, 11:50 AM
Not the disabledCls config, but the actual grid div element is <div disabled ... />, which is causing the element to show as gray.

AJAIN32
26 Jun 2015, 12:20 PM
Thanks Tristan for your quick response,

I see the attribute disable in the div, i tried to remove that in IE developer tools and its working fine. is there any way to remove this attribute from grid without impacting the other things ? so it can be worked for IE as well ?

Thanks,
Ankit

AJAIN32
26 Jun 2015, 12:39 PM
I tried to remove disable attribute using -

grid.getEl().dom.disabled = false;

and it worked, grid is still disabled and looks like enabled.

just one question - manuplating the dom elements - will it impact the components as what i understood is i changed disabled as false from true but its still dsabled. seems fine as per my requirements. so you see any issues with this piece of code ?

Thanks,
Ankit

tristan.lee
6 Jul 2015, 1:14 PM
Changing the DOM is only going to affect that, not the component itself.

AJAIN32
6 Jul 2015, 4:54 PM
Thanks Tristan :)