enabe/disable textbox field by checkbox

You wanted it to be such that the checkbox being unchecked causes the textfield to be enabled. In that case the first solution will work, and not the next. However, if you want it to be neater: (I also added the last statement in the handler to inform the user that the textbox is enabled)

<form>
<input type='text' name='tb' />
<input type='checkbox' onclick='form.tb.disabled=checked; if( !checked ) form.tb.focus();' />
</form>
                                              

1:
2:
3:
4:

Hi all!

 I tried the codes above but seems not to work in my case. I have a .jspx page in which I am defining the checkbox and the textfield like this:

<html:checkbox property="xxxProperty1" style="border:none;" onclick="disableTextBox();" />&#160;
 
<html:text property="text_property" styleId="validfrom" maxlength="10" styleClass="form_datum" />

                                              

1:
2:
3:

Try this:

<html:checkbox property="xxxProperty1" style="border:none;" onclick="form.text_property.disabled=checked; if( !checked ) form.text_property.focus();" />&#160;
<html:text property="text_property" styleId="validfrom" maxlength="10" styleClass="form_datum" />

                                              

1:
2:

I am just interested how this added on the the "Assisted solutions" above:

"
you'll need onclick="disableTextBox(this)" and in script:

function disableTextBox(checkbox)
{
  document.getElementById('validfrom').disabled = checkbox.checked;
}
"

That's down as the accepted solution (to me, at least), not an assisted, what don't you understand?

--
Lee

I'm not saying that my comment should be accepted, but that the first comment should be accepted because it is he who posted a working solution first.

Well, the author did provide feedback saying all those solutions didn't work.  Perhaps the author required a more explicit example and is not experienced enough to realise that the other examples could be made to work if modified to suit his document.

Looking at your solution now, I don't think form.tb.disabled refers to the checkbox, because window.form is undefined.  The form requires a name to be addressed like that, and you need to use document.<<formName>> to be cross-browser friendly.

As an expert, sometimes decisions don't go in your favour, even when you know you've given the best answer.  I seldom find it worth the effort of bothering about it.  Just keep focusing on the unanswered questions, and the poor decisions even themselves out.

--
Lee

form.tb surely does refer to the checkbox, because form is relative to the current object which the handler is running from. "The form requires a name to be addressed like that" -- I don't find this flexible. Even if element.form doesn't work, which it sure works (I always test my solutions out), I would use something like parentNode. But anyway I felt that the first example was the first solution posted and the most explicit of all, and I just was interested how your solution added on to it. In case you're wondering about my solution, I added on the focus() method as it would be better for the user to know the input field has been enabled. (At least in IE there is no indication)

Sorry it doesn't refer to the checkbox, it refers to the textbox

Oh, I beg your pardon, that's what I meant.  But my point was it doesn't refer to anything, because it doesn't refer to the form.

--
Lee

It does... if you have time you can go check it out... as I said I always check my solutions before posting

Anyway if you didn't know, element.form refers to the form containing the element if it is a form control. Defined in the W3C World Wide Web Consortium (W3C) Document Object Model (DOM) Level 1.
See: http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-html.html

Sorry, you're correct.  Older browsers required form element access to be via document.<<formName>>, but that's irrelevant these days, I had forgotten about the newer ways even though I now remember even using it.  

So, you provided a working example, but the author seemed to think that it wasn't the answer to his question.  Like I said before, perhaps the author didn't have the experience or expertise to apply your example to their situation.  As the author has not participated in this Open Discussion, who can say?  I can't really help any further.

--
Lee

 Hi all!
 It seems that a small question triggered a lot of discussions around this subject. I was kept busy with my beginners days so I did not pay fully attention on this thread. So I hope this will answer to all your questions.
As I said I am a beginner in JavaScript and now I am actually learning how to implement it into pages. As a second aspect the script is running in conjunction with an .jspx page on struts which makes things a bit more complicated from the jscript point. Therefore Lee's solution went as copy paste with modifications for my particular case and worked immediately.

 @ limweizhong I am really grateful to you for the posts, both as a possible solution and as a comment. I am looking forward that on javascript questions to have you as a solution provider, but as mentioned before I needed a quick fix and I had not much time on my disposal.
 

I am just wondering if someone can try the last comment above -- the code you provided added on to by me -- (because I don't have jspx). I'm willing to say I may be wrong for that comment ('cause I cannot test it here, and I don't use jsp)