Presence of an uneditable but selectable text field

I am making a web application. There are times when a form can be read-only. To simulate this using HTML, I use it so that all (dynamically created) text fields containing the content are disabled. This works quite well, but if the text is very large, and not all of this is visible immediately (especially in multi-line boxes), then the user will not be able to scroll it. In addition, another problem is the inability to copy and paste text from disabled text fields.

So, I need a way to make it so that you cannot change the contents in the text box, but you can select the text and the scroll bar works.

Also, I am testing this in Firefox 3.5, although I believe that IE has similar problems (something compatible with both, please)

+1
source share
3 answers

Use JS:

<input type="text" readonly="readonly" onfocus="this.blur();" /> 

Also, is it possible to make a scrollable div ( overflow:auto; in CSS) instead?

+5
source

How about just using a <div> element with static height / width and overflow: auto ? You can add additional styles to make them look like <textarea> if you want.

+3
source

EDIT: A swallowed label is made. Now that makes sense.

this.blur () will make selection impossible, I think.

 <input type="text" readonly> 

should help. HTML 4 and XHTML 1.0 compatible. I don't know about future compatibility (i.e. HTML 5).

+2
source

All Articles