Checkbox to Enable Input Box

Ben · Jun 3, 2005

Here's what I have se far:

<script type="text/javascript">
other_text.disabled = true;
function other_text() {
other_text.disabled = (other_check.checked == false)? false :
true;
}
</script>
<input type="checkbox" id="other_check" name="other_check"
onchange="other_text()" /><label for="other_check">Other</label><br />
<input type="text" id="other_text" />

But it doesn't work.

I did have it working using a onchange on the checkbox and having the
"other_text" text box disabled by default, but this ment that if the
browser didn't support or have JS enabled then the text box would stay
disabled. So I need to disable it using javascript, and re-enable it
when the checkbox is checked.

Any suggestions?

Randy Webb · Jun 3, 2005

Ben said:
Here's what I have se far:

<script type="text/javascript">
other_text.disabled = true;

2 things:

1) When that statement is executed, the other_text field doesn't exist
yet. That means it can't disable what doesn't exist.
2) The fieldName.property syntax is IE only and as such won't work in
any other browser.

document.formName.elementName.property;

Use the onload event handler to fire a function that does what you are
trying to do:

window.onload = someFunction;

function someFunction(){
document.forms['formName'].elements['other_text'].disabled;
}

Or better yet, just set your onload to point to your function

window.onload = other_text;

and ditch the first line.

Ben · Jun 3, 2005

Still doesn't work. ;(

Random · Jun 3, 2005

Ben said:
Here's what I have se far:

<script type="text/javascript">
other_text.disabled = true;

The element ID'd as 'other_text' doesn't exist at the time the above
line is executed. This should be done either onLoad or in a <script>
block after the <input id=other_text>

This, I think, is the crux of your problem.

function other_text() {
other_text.disabled = (other_check.checked == false)? false :
true;

Change the name of the function or change the id of the text input.

You can also rewrite this more simply as:
other_text.disable = ( !other_check.checked );

}
</script>
<input type="checkbox" id="other_check" name="other_check"
onchange="other_text()" /><label for="other_check">Other</label><br />
<input type="text" id="other_text" />

But it doesn't work.

I did have it working using a onchange on the checkbox and having the
"other_text" text box disabled by default, but this ment that if the
browser didn't support or have JS enabled then the text box would stay
disabled. So I need to disable it using javascript, and re-enable it
when the checkbox is checked.

Any suggestions?

Consider instead:

<script type="text/javascript">

function endisable( ) {
document.forms['other_form'].elements['other_text'].disabled =
! document.forms['other_form'].elements[
'other_check'].checked;
}

</script>
<body onload="document.forms['other_form'].elements[
'other_text'].disabled=true;">
<form id="other_form">
<input type="checkbox" id="other_check" name="other_check"
onchange="endisable()" />
<label for="other_check">Other</label><br />
<input type="text" id="other_text" />

Ben · Jun 3, 2005

Thanks, that works fine, but still one problem.

Is there anyway to do it without the <body> tag?

Random · Jun 3, 2005

Ben said:
Thanks, that works fine, but still one problem.

Is there anyway to do it without the <body> tag?

Sure. Just execute this line of JS code:
document.forms['other_form'].elements[
'other_text'].disabled=true;

Anywhere after the <input id=other_text /> tag.

Ben · Jun 3, 2005

Thanks again.

How to make an input box enable for only past dates and for the startdate if it falls in the current month?	5	Jun 12, 2023
How to display input options only after selecting an option from the 'select class' tag JS?	6	May 12, 2023
"input-group-text" help	7	Aug 10, 2023
Make an <input type="text"> input-ready for input	8	Aug 17, 2023
How can I hide a div using an event listener on multiple checkboxes?	6	Dec 23, 2022
Survey details won't go through using php, ajax, Mysql	0	Oct 26, 2023
Select box options to disable/enable checkbox?	2	Jan 18, 2006
HCaptcha - How to stop page from refreshing on submit if captcha is not checked/validated	1	Aug 29, 2023

Checkbox to Enable Input Box

Ben

Randy Webb

Ben

Random

Ben

Random

Ben

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads