View Full Version : How to hide a text Area?

05-29-2006, 04:03 PM

I am having a form and below is the code that generates the dropdown list using the data from the database.

//function for generating selection list for duration
function loadduration($duration){
$conn=new oConn;
$sql='SELECT durationagreementid,durationifagreement FROM howard.cda_durationagreement';
if (!empty($conn->error)) {
echo $conn->error;
if ($conn->nrows<1) {
echo 'Duration Agreement Table Empty';
} else {
$i = 0;
while ($i<$records){
if ($duration == $results['DURATIONAGREEMENTID'][$i]){
$selected = "SELECTED";

$duration_menu.= '<option value="'.$results['DURATIONAGREEMENTID'][$i].'" '.$selected.'>'.$results['DURATIONIFAGREEMENT'][$i].'</option>';
return $duration_menu;


Here is the html code corresponding to this function:
<td class="header">DURATION :</td>
<td><select class="inputfield" name="cda_duration" id="cda_duration"
<option value="">--------- <?php echo loadduration($duration) ;?>
<td class="header" nowrap >OTHER:</td>
<td><textarea name="cda_otherinfo" id="cda_otherinfo" rows="3" cols="29" ></textarea></td>

--------------------------------------------------------------------------My main aim is to hide the TEXT AREA corresponding to OTHER: and display it only when the last option is selected in the DURATION:dropdown

Could anyone help me with an javascript function that does this job, iam finding it difficult since the dropdown is generated from the database.


05-29-2006, 04:11 PM
first you have to hide your textarea.
<textarea style="display:none"......>

Now, if you say that your last option could do that job:

<select onchange="this.form['cda_otherinfo'].style.display=this.selectedIndex==this.options.length-1?'block'?'none'"....>

05-29-2006, 04:17 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"


<script language="JavaScript" type="text/javascript">

function Hide(obj,id){
var ta= document.getElementById(id);
if (obj.selectedIndex==obj.options.length-1){

<td class="header">DURATION :</td>
<select class="inputfield" name="cda_duration" id="cda_duration" onchange="Hide(this,'OTHER');" >
<option value="">Option 1</option>
<option value="">Option 2</option>
<option value="">Option 3</option>
<option value="">Option 4</option>
<option value="">Option 5</option>
<td class="header" nowrap >
<textarea name="OTHER" id="OTHER" rows="3" cols="29" ></textarea>
<textarea name="cda_otherinfo" id="cda_otherinfo" rows="3" cols="29" ></textarea>