Tuesday, November 10, 2015

Making HTML readonly Attribute Look Like Disabled

A quick entry in case anybody else runs into this scenario. I have a form with some text boxes which need to display as disabled, but the values aren't being submitted with the form. As it turns out, this is native behavior for the 'disabled' attribute.

The workaround is to use the 'readonly' attribute instead, but the problem with that is it doesn't render with a grayed out background. After fiddling for a while I came up with the following script:


dojo.ready(function(){
    dojo.query("[readonly]").forEach(function(node, index, arr){   
 dojo.attr(node.parentNode,"style", "background-color: #efefef !important");   
    });
 });

Maybe someone else will find this useful.