apply the 'readonly' attribute to all textboxes

crmpicco · April 18th, 2006, 08:10 AM

Code:

<input type="text" class="font4" name="OutDispDate" value="" id="OutDispDate" readonly />
<input type="text" class="font4" name="OutDispClass" value="" id="OutDispClass" readonly />

Is there a way to apply the 'readonly' attribute to all textboxes on the page with CSS?

www.crmpicco.co.uk
www.ie7.com

vinod_yadav1919 · April 18th, 2006, 09:10 AM

Hii Crmpicco!!
<script>
function call()
{
obj=document.all.length
for(i=0;i<obj;i++)
{

    if(document.all[i].type=="text")
    {
        document.all[i].readOnly=true
    }
}
}
</script>
<body >

<input type=button onclick="call()">
<input type=text name=z value=1230>
<input type=text name=z value=1230>
<input type=text name=z value=1230>
<input type=text name=z value=1230>
<input type=text name=z value=1230>
<input type=text name=z value=1230>
</body>

Plz check some browser do not support document.all ;)
Hope this will help you

Cheers :)

vinod

crmpicco · April 18th, 2006, 09:25 AM

thanks Vinod, that was helpful. However, i was just enquiring if it was possible to do it in CSS? I.e

<style type=text/css>
Text {readonly: true}
</style>

www.crmpicco.co.uk
www.ie7.com

vinod_yadav1919 · April 20th, 2006, 04:51 AM

Hi Crmpicco!!
Its not possible with single syntax(in css) like you provided.

while input.readOnly/input.readonly works great,
you can't set the readonly value using single statement (by using css),you need to incorporate javascript for this ,and check the type=text on that function.

alternatively you can also use getElementsByTagName('input'); and then check type=text and make it to readOnly=true as i posted in previous post.

Hope this will help you

Cheers :)

vinod

crmpicco · April 20th, 2006, 06:35 AM

thank you Vinod, the code you posted was great. seems it cant be done in CSS then, thank you anyway!

www.crmpicco.co.uk
www.ie7.com

meow · April 24th, 2006, 05:54 AM

You can't even make one input readonly with CSS. That is not what CSS is for.

--
http://yupapa.com

crmpicco · April 24th, 2006, 07:58 AM

thanks vinod and meow

www.crmpicco.co.uk
www.ie7.com

richard.york · April 24th, 2006, 01:57 PM

There are some things in the works for controling the presentation of these elements depending on their state, read more about that here:

http://www.w3.org/TR/2004/CR-css3-ui-20040511/

There is also another CSS 3 module in development for extending CSS to include behavioral enhancements that traditionally have their place in script and markup, such as the ability to attach JS events from CSS.

http://www.w3.org/TR/1999/WD-becss-19990804

You can do something like this now using purely script and Dean Edwards's cssQuery, which works in /every/ modern browser you'd have to worry about.

http://dean.edwards.name/my/cssQuery/

Of course it'll likely be years still before we see any of the official W3C stuff in a browser. Although Explorer can do that with CSS behaviors now, but that feature is proprietary and not implemented by other browsers at this time.

http://msdn.microsoft.com/workshop/a...s/overview.asp

Dean Edwards also wrote something to help gecko-based browsers to understand Explorer behaviors. (Ain't he just a swell guy??) :)

http://dean.edwards.name/moz-behaviors/

Personally, I'll just stick with markup and script. Regardless of which method you chose, script is going to be involved anyway.

Regards,
Rich

--
Author,
Beginning CSS: Cascading Style Sheets For Web Design
CSS Instant Results

http://www.catb.org/~esr/faqs/smart-questions.html

vinod_yadav1919 · April 24th, 2006, 11:47 PM

Hii richard!!

Excellent link!

Thanks Again

Cheers :)

vinod

crmpicco · April 26th, 2006, 05:26 AM

thanks Richard, the moz-behaviours link was very interesting. I did wonder if IE-only code could be modified to be cross-browser!

Danke schon!

www.crmpicco.co.uk
www.ie7.com