Hidden textarea

[Ritesh Shah]

Is there anyway in JavaScript to hide/show a textarea based on what radio
button is selected? I am totally new to JavaScript and have no idea about
any of it.
Thanks.

[mscir]

Re: Hidden textarea

Ritesh Shah wrote:[color=blue]
> Is there anyway in JavaScript to hide/show a textarea based on what radio
> button is selected? I am totally new to JavaScript and have no idea about
> any of it.
> Thanks.[/color]

How about: put it inside a div and set div visibility, this works in my
IE6, Netscape 7.1, Firefox 0.8:

function setdivvisibilit y(show) {
if (show)
showvar="visibl e";
else
showvar="hidden ";
document.getEle mentById('div1' ).style.visibil ity=showvar;
}

Show Div <input type="checkbox" onclick="setdiv visibility(this .checked)"
checked>
<p>
Show Div<input type="radio" name=radiovisib ility"
onclick="setdiv visibility(true )" checked>
Hide Div<input type="radio" name=radiovisib ility"
onclick="setdiv visibility(fals e)" >

<div id="div1" name="div1">
<textarea rows="1" cols="20">
Sample Text Sample Text Sample Text Sample Text Sample Text Sample
Text Sample Text Sample Text
</textarea>
</div>

[Michael Winter]

Re: Hidden textarea

On Sun, 25 Apr 2004 19:08:59 -0700, mscir
<mscir@access4l ess.com.net.org .uk> wrote:
[color=blue]
> Ritesh Shah wrote:
>[color=green]
>> Is there anyway in JavaScript to hide/show a textarea based on what
>> radio button is selected? I am totally new to JavaScript and have no
>> idea about any of it.[/color]
>
> How about: put it inside a div and set div visibility, this works in my
> IE6, Netscape 7.1, Firefox 0.8:[/color]

Why use a DIV? You're adding structure where there is none. The TEXTAREA
can be hidden directly. Furthermore, using the visibility property isn't
always appropriate: hidden elements still take up space. Depending on the
structure and layout of the OP's document, use of the display property
might be better.
[color=blue]
> function setdivvisibilit y(show) {
> if (show)
> showvar="visibl e";
> else
> showvar="hidden ";[/color]

The variable, showvar, is now global. Use the var keyword to keep it local.
[color=blue]
> document.getEle mentById('div1' ).style.visibil ity=showvar;
> }[/color]

It would be a good idea to code defensively. I notice that you regularly
use methods, object and return values without checking for support. This
produces code that might fail and produce needless errors. Even
applications in C++, with a known environment, should be written
defensively, and more so for browser scripting.

// Make sure that document.getEle mentById() is meaningful
if( !document.getEl ementById ) {
if( document.all ) {
document.getEle mentById = function( id ) {
return document.all[ id ];
};
} else {
document.getEle mentById = function() {
return null;
};
}
}

function setVisibility( id, show ) {
var obj = document.getEle mentById( id );

if( obj && obj.style ) {
// Use an empty string to return to the default value.
obj.style.visib ility = show ? '' : hidden;

/*
* Alternatively:
* obj.style.displ ay = show ? '' : 'none';
*/
}
}

The call should now be modified to pass the id attribute value of the
TEXTAREA to be hidden.

[snip]

Mike

--
Michael Winter
M.Winter@blueyo nder.co.invalid (replace ".invalid" with ".uk" to reply)