By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,496 Members | 1,489 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,496 IT Pros & Developers. It's quick & easy.

Text boxes and read-only text

P: n/a
I'm wondering what standard/best practices are for the following scenario:

I have a page representing several fields for stored data. If the user has
sufficient access privileges, the page is rendered w/ read/write text boxes and
they can edit the various fields as needed. However, if the user doesn't have
sufficient privileges (i.e. view only), the page is rendered w/ the text boxes
set to read-only. However, this results in a rather clunky looking page, and
if there is more text in a box than can be rendered w/i the specified box
height, then the user must scroll. Further, when printing the page, the text
is clipped to the box.

So, my thought has been to re-design the page to use two different controls for
each text field: a text box for read/write, and a label (static text) for
read-only. My thought that it will result in a much cleaner view page, and
printing will be as expected. The negative is that there are then two controls
for each field, and I must hide/show the appropriate control depending on the
read-write/read-only status.

Is there a better way to do this that doesn't rely on two controls for each
control?

Thanks for any thoughts and insights.
Nov 18 '05 #1
Share this Question
Share on Google+
2 Replies


P: n/a
What is your browser base?

If you know that it is IE only..

check out contenteditable... basically it allows any html element to be
editable..
http://msdn.microsoft.com/library/de...nteditable.asp

so you could do
<div contenteditable="true">This text it editable</div>
for those that have read write..
then simply change the flag to false if it is readonly,

This means printing doesnt get cliped either.

To make it so that you can still reference input ins your code you can do

<div contenteditable="true" id="Body" onpropertychange="BodyInput.value =
this.innerText;">This text it editable</div>
<input type="hidden" name="BodyInput" value="">

then you simple get the data from the this.BodyInput.value property on the
server.

Not sure if this is what you are after but it may give you ideas as to where
to go from here.

"Julie" <ju***@nospam.com> wrote in message
news:40***************@nospam.com...
I'm wondering what standard/best practices are for the following scenario:

I have a page representing several fields for stored data. If the user has sufficient access privileges, the page is rendered w/ read/write text boxes and they can edit the various fields as needed. However, if the user doesn't have sufficient privileges (i.e. view only), the page is rendered w/ the text boxes set to read-only. However, this results in a rather clunky looking page, and if there is more text in a box than can be rendered w/i the specified box
height, then the user must scroll. Further, when printing the page, the text is clipped to the box.

So, my thought has been to re-design the page to use two different controls for each text field: a text box for read/write, and a label (static text) for
read-only. My thought that it will result in a much cleaner view page, and printing will be as expected. The negative is that there are then two controls for each field, and I must hide/show the appropriate control depending on the read-write/read-only status.

Is there a better way to do this that doesn't rely on two controls for each control?

Thanks for any thoughts and insights.

Nov 18 '05 #2

P: n/a
Darren Clark wrote:

What is your browser base?

If you know that it is IE only..

check out contenteditable... basically it allows any html element to be
editable..
http://msdn.microsoft.com/library/de...nteditable.asp

so you could do
<div contenteditable="true">This text it editable</div>
for those that have read write..
then simply change the flag to false if it is readonly,

This means printing doesnt get cliped either.

To make it so that you can still reference input ins your code you can do

<div contenteditable="true" id="Body" onpropertychange="BodyInput.value =
this.innerText;">This text it editable</div>
<input type="hidden" name="BodyInput" value="">

then you simple get the data from the this.BodyInput.value property on the
server.

Not sure if this is what you are after but it may give you ideas as to where
to go from here.


Thanks for the link and info, I'll look into it.

And, yes, my target is IE.
Nov 18 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.