Read Only TextArea box

HTML & CSS
1

I an interested in seeing if there is such a thing as a Read Only TextArea box. I would like to be able to scroll to view all the text but not to be able to write to it. While I got you here how many is the maximum characters in a TextArea box?

2

That’s not really the point of a textarea box. Perhaps you should be using a different element. What’s the context of this?

While I got you here how many is the maximum characters in a TextArea box?

I’m not aware of there being a maximum, unless you set one. Would be interesting to know for sure, though. I can imagine a browser might choke if you tried to insert something like a whole novel, though. :slight_smile:

3

Yes there is a ‘readonly’ attribute for the INPUT and TEXTAREA element preventing the user from editing the content of the text or password input types and read-only elements are still submitted with the form. There is also a ‘disabled’ attribute to disable the control.

The ‘size’ and ‘maxlength’ attributes provide the suggestive number of characters and maximum number of characters of the text field. I suspect you are wanting something special like a ‘terms and conditions’ to display.

4

If you want to show something like T & C’s like ralph.m suggested then I wouldn’t use a form control element like textarea either.

You could do something like this instead.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
        <title></title>
        <style type="text/css">
            #TnC {
                width: 600px;
                height: 200px;
                overflow-y: scroll;
                margin: 20px auto 20px auto;
                padding: 10px 10px 20px 10px;
                border: 1px solid red;
            }
        </style>
    </head>
    <body>
        <div id="TnC">
            <p>
                Lorem ipsum dolor sit amet, tellus et. Molestie auctor nisl faucibus ut, lorem tortor mattis, fusce nullam enim fringilla vel. 
                Mauris vitae gravida dolor praesent. Id in nascetur aut odio, nam et. Pede libero bibendum sit felis pretium sodales, fusce 
                pharetra vestibulum bibendum morbi ultricies nullam, est nulla, id amet mollis. Nec consectetuer urna dapibus luctus ut, 
                ipsum nascetur consequat dapibus dui ac molestie, est nascetur id nec nunc. Mi etiam mauris facilisi sed, nec ut id, 
                aliquam non, taciti donec ut. Risus integer hymenaeos velit, nisl suspendisse sollicitudin ut, sed tempor sagittis curae dolor, 
                volutpat massa ut sagittis. Voluptatem a enim, lobortis lectus volutpat, vitae vero diam purus morbi class, tristique donec 
                ante sed, ac turpis dis dui vestibulum aut.
            </p>
            <p>
                Tortor sit voluptatem pede sodales turpis hac, vel velit suscipit, luctus bibendum molestie lacinia neque. Porttitor ante 
                turpis in voluptate vivamus autem, gravida magna amet porta praesent tincidunt at, nam enim sodales ante non, sit nunc 
                posuere odio libero nibh ac. Amet id dignissim vehicula tempor et eros. Est hendrerit est quis, et viverra est class pede 
                voluptas libero, sed mauris tincidunt, ultrices praesent. Iaculis vivamus sapien id, lorem ante aliquet, commodo pede imperdiet 
                congue, dictum integer eget sed orci. Suscipit vitae quis, massa elit faucibus massa, interdum nam pharetra nulla sed, sollicitudin 
                egestas, magna viverra. 
            </p>
        </div>
    </body>
</html>