Connecting Tech Pros Worldwide Forums | Help | Site Map

change textbox readonly

nirmalsingh's Avatar
Familiar Sight
 
Join Date: Sep 2006
Location: Madurai - India
Posts: 217
#1: Jun 1 '07
hai all,
in html i have created a text box and make it readonly such as

<input type="text" id="age" readonly/>


now i want to make it enable(through javascript) to type in text box . what should i do for this?

dmjpro's Avatar
Lives Here
 
Join Date: Jan 2007
Location: India (West-Bengal)
Posts: 2,451
#2: Jun 1 '07

re: change textbox readonly


Expand|Select|Wrap|Line Numbers
  1. obj_ref.readOnly = false;
  2. //or obj_ref.setAttribute("readonly") = false;
  3.  
kind regards.
dmjpro.
gits's Avatar
Moderator
 
Join Date: May 2007
Location: Munich, Germany
Posts: 4,246
#3: Jun 1 '07

re: change textbox readonly


Quote:

Originally Posted by dmjpro

Expand|Select|Wrap|Line Numbers
  1. obj_ref.readOnly = false;
  2. //or obj_ref.setAttribute("readonly") = false;
  3.  
kind regards.
dmjpro.

hi ... please excuse me and may be i'm wrong ... but i think that will not work, as far as i know ... most browsers look for existence of the readonly attribute ... and therefore it works without having a value assigned:

[HTML]<input type="text" id="age" readonly/>[/HTML]

so the right way is to remove that attribute from that element, you may use a function like the shown one below:

Expand|Select|Wrap|Line Numbers
  1. /**
  2.  * @param obj - reference to element where attr should be changed (use: 
  3.  * document.getElementById('id') or whatever you want for this)
  4.  * @param - state true or false
  5.  */
  6. function set_readonly_state(obj, state) {
  7.     if (state) {
  8.         obj.setAttribute('readonly', state);
  9.     } else {
  10.         obj.removeAttribute('readonly');
  11.     }
  12. }
kind regards ...
acoder's Avatar
Site Moderator
 
Join Date: Nov 2006
Location: UK
Posts: 14,750
#4: Jun 1 '07

re: change textbox readonly


Quote:

Originally Posted by gits

hi ... please excuse me and may be i'm wrong ... but i think that will not work, as far as i know ...

Yes, it should work, see link. I tried some sample code in Firefox and it works fine.
gits's Avatar
Moderator
 
Join Date: May 2007
Location: Munich, Germany
Posts: 4,246
#5: Jun 1 '07

re: change textbox readonly


Quote:

Originally Posted by acoder

Yes, it should work, see link. I tried some sample code in Firefox and it works fine.

hmmm ... thats right ... i'm sorry! but using this way is a little bit different from my point of view ... until there is a difference between setting an attribute or using a property of an element. the code i provided, simply uses the readonly attribute of the input-element. I didn't know about the 'readOnly' property of the element and of course this works too ... but i think it is good (coding-)practice to use only one way of setting ui-element-states that means use properties OR use attributes (in case they do the 'same') ... i hope you understand what i'm trying to say? the input-element in our example is set to readonly-state through an attribute ... setAttribute it to false will not work ... you have to remove it to enable the widget.

if you prefer to set properties ... than it works fine too ... of course, but it mixes the possibilities and in larger apps this is hard to debug, or to find ... it's only an idea of me and my personal point of view ... you may agree or disagree with it ... ;)

kind regards ...
acoder's Avatar
Site Moderator
 
Join Date: Nov 2006
Location: UK
Posts: 14,750
#6: Jun 4 '07

re: change textbox readonly


Quote:

Originally Posted by gits

... it's only an idea of me and my personal point of view ... you may agree or disagree with it ... ;)

I don't disagree with what you're saying. I was merely pointing out that the readOnly property does exist.
Reply