Link to home
Start Free TrialLog in
Avatar of rgb192
rgb192Flag for United States of America

asked on

want only one textarea open

want only one textarea open


this change doesnt work

onchange="if(this.value.indexOf('Wed')==0){ document.getElementById('textareaID2').style.display='block';
document.getElementById('textareaID').style.display='none';}
 else{ document.getElementById('textareaID2').style.display='none';}"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<form method=post action=pb-dropck.php>
<select name=t1 onchange="if(this.value.indexOf('Tue')==0) document.getElementById('textareaID').style.display='block'; else document.getElementById('textareaID').style.display='none';">
<option value=Mon $Mon>Mon</option>
<option value=Tue $Tue>Tue</option>
<option value=Wed $Wed>Wed</option>
<option value=Thu $Thu>Thu</option>
<option value=Fri $Fri>Fri</option>
<option value=Sat $Sat>Sat</option>
<option value=Sun $Sun>Sun</option>
</select>

<select name=t2 onchange="if(this.value.indexOf('Wed')==0) document.getElementById('textareaID2').style.display='block'; else document.getElementById('textareaID2').style.display='none';">
<option value=Mon $Mon>Mon</option>
<option value=Tue $Tue>Tue</option>
<option value=Wed $Wed>Wed</option>
<option value=Thu $Thu>Thu</option>
<option value=Fri $Fri>Fri</option>
<option value=Sat $Sat>Sat</option>
<option value=Sun $Sun>Sun</option>
</select>
<input type=submit value=Submit>
<textarea id="textareaID" cols="20" rows="20" style="display:none"></textarea>
<textarea id="textareaID2" cols="20" rows="20" style="display:none"></textarea>
</form>
</body>
</html>

Open in new window

Avatar of spamzerozone
spamzerozone

In html
<textarea></textarea>

Dont know about php sorry.
onchange="if(this.value.indexOf('Wed')==0){ document.getElementById('textareaID2').style.display='block';
document.getElementById('textareaID').style.display='none';}
 else{ document.getElementById('textareaID2').style.display='none';document.getElementById('textareaID').style.display='block';}"


will this work or you are looking for something else?
Avatar of Rajesh Dalmia
in onchange what indexOf('Tue') and indexOf('Wed') means?
I think in indexOf it should be the id of the select box...
May be attached file may help you.
textarea-test.html
Check this :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<form method=post action=pb-dropck.php>

<select name=t1 onchange="if(this.value.indexOf('Tue')==0){document.getElementById('textareaID2').style.display='none';document.getElementById('textareaID').style.display='block';}else{document.getElementById('textareaID2').style.display='block';document.getElementById('textareaID').style.display='none';}">
    <option value=Mon $Mon>Mon</option>
    <option value=Tue $Tue>Tue</option>
    <option value=Wed $Wed>Wed</option>
    <option value=Thu $Thu>Thu</option>
    <option value=Fri $Fri>Fri</option>
    <option value=Sat $Sat>Sat</option>
    <option value=Sun $Sun>Sun</option>
</select>

<select name=t2 onchange="if(this.value.indexOf('Wed')==0){document.getElementById('textareaID').style.display='none';document.getElementById('textareaID2').style.display='block';}else{document.getElementById('textareaID').style.display='block';document.getElementById('textareaID2').style.display='none';}">
    <option value=Mon $Mon>Mon</option>
    <option value=Tue $Tue>Tue</option>
    <option value=Wed $Wed>Wed</option>
    <option value=Thu $Thu>Thu</option>
    <option value=Fri $Fri>Fri</option>
    <option value=Sat $Sat>Sat</option>
    <option value=Sun $Sun>Sun</option>
</select>

<input type=submit value=Submit>
<textarea id="textareaID" cols="20" rows="20" style="display:none"></textarea>
<textarea id="textareaID2" cols="20" rows="20" style="display:none"></textarea>

</form>
</body>
</html>

Open in new window

This too :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<form method=post action=pb-dropck.php>

<input type="radio" value="Mon" name="t1" />Mon<br />
<input type="radio" value="Tue" name="t1" onclick="if(this.checked) {document.getElementById('textareaID').style.display='block';document.getElementById('textareaID2').style.display='none';}" />Tue<br />
<input type="radio" value="Wed" name="t1" onclick="if(this.checked) {document.getElementById('textareaID2').style.display='block';document.getElementById('textareaID').style.display='none';}" />Wed<br />
<input type="radio" value="Thu" name="t1" />Thu<br />
<input type="radio" value="Fri" name="t1" />Fri<br />
<input type="radio" value="Sat" name="t1" />Sat<br />
<input type="radio" value="Sun" name="t1" />Sun<br />
<input type="submit" value="Submit" />
<textarea id="textareaID" cols="20" rows="20" style="display:none">1</textarea>
<textarea id="textareaID2" cols="20" rows="20" style="display:none">2</textarea>

</form>
</body>
</html>

Open in new window

Avatar of rgb192

ASKER

the textarea does not disappear if
neither
tue or wed is selected
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<form method=post action=pb-dropck.php>

<select name=t1 onchange="if(this.value.indexOf('Tue')==0){document.getElementById('textareaID2').style.display='none';document.getElementById('textareaID').style.display='block';}else{document.getElementById('textareaID2').style.display='block';document.getElementById('textareaID').style.display='none';}">
    <option value=Mon $Mon>Mon</option>
    <option value=Tue $Tue>Tue</option>
    <option value=Wed $Wed>Wed</option>
    <option value=Thu $Thu>Thu</option>
    <option value=Fri $Fri>Fri</option>
    <option value=Sat $Sat>Sat</option>
    <option value=Sun $Sun>Sun</option>
</select>

<select name=t2 onchange="if(this.value.indexOf('Wed')==0){document.getElementById('textareaID').style.display='none';document.getElementById('textareaID2').style.display='block';}else{document.getElementById('textareaID').style.display='block';document.getElementById('textareaID2').style.display='none';}">
    <option value=Mon $Mon>Mon</option>
    <option value=Tue $Tue>Tue</option>
    <option value=Wed $Wed>Wed</option>
    <option value=Thu $Thu>Thu</option>
    <option value=Fri $Fri>Fri</option>
    <option value=Sat $Sat>Sat</option>
    <option value=Sun $Sun>Sun</option>
</select>

<input type=submit value=Submit>
<textarea id="textareaID" cols="20" rows="20" style="display:none"></textarea>
<textarea id="textareaID2" cols="20" rows="20" style="display:none"></textarea>

</form>
</body>
</html>

Open in new window

Check this :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<form method=post action=pb-dropck.php>

<select name=t1 onchange="function $(o){return document.getElementById(o);};$('textareaID').style.display='none';$('textareaID2').style.display='none';var _s=this.value.substr(0,3).toLowerCase();switch(_s){case 'tue':$('textareaID').style.display='block';break;case 'wed':$('textareaID2').style.display='block';break;}">
    <option value=Mon $Mon>Mon</option>
    <option value=Tue $Tue>Tue</option>
    <option value=Wed $Wed>Wed</option>
    <option value=Thu $Thu>Thu</option>
    <option value=Fri $Fri>Fri</option>
    <option value=Sat $Sat>Sat</option>
    <option value=Sun $Sun>Sun</option>
</select>

<select name=t2 onchange="function $(o){return document.getElementById(o);};$('textareaID').style.display='none';$('textareaID2').style.display='none';var _s=this.value.substr(0,3).toLowerCase();switch(_s){case 'wed':$('textareaID2').style.display='block';break;case 'tue':$('textareaID').style.display='block';break;}">
    <option value=Mon $Mon>Mon</option>
    <option value=Tue $Tue>Tue</option>
    <option value=Wed $Wed>Wed</option>
    <option value=Thu $Thu>Thu</option>
    <option value=Fri $Fri>Fri</option>
    <option value=Sat $Sat>Sat</option>
    <option value=Sun $Sun>Sun</option>
</select>

<input type=submit value=Submit>
<textarea id="textareaID" cols="20" rows="20" style="display:none"></textarea>
<textarea id="textareaID2" cols="20" rows="20" style="display:none"></textarea>

</form>
</body>
</html>

Open in new window

Avatar of rgb192

ASKER

I placed a 1 in textarea1 and 2 in textarea2

works
but when I
use select1, textarea2 gets open if I start at tue and go to wed

select1 should only open textarea1
and
select2 should only open textarea2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<form method=post action=pb-dropck.php>

<select name=t1 onchange="function $(o){return document.getElementById(o);};$('textareaID').style.display='none';$('textareaID2').style.display='none';var _s=this.value.substr(0,3).toLowerCase();switch(_s){case 'tue':$('textareaID').style.display='block';break;case 'wed':$('textareaID2').style.display='block';break;}">
    <option value=Mon $Mon>Mon</option>
    <option value=Tue $Tue>Tue</option>
    <option value=Wed $Wed>Wed</option>
    <option value=Thu $Thu>Thu</option>
    <option value=Fri $Fri>Fri</option>
    <option value=Sat $Sat>Sat</option>
    <option value=Sun $Sun>Sun</option>
</select>

<select name=t2 onchange="function $(o){return document.getElementById(o);};$('textareaID').style.display='none';$('textareaID2').style.display='none';var _s=this.value.substr(0,3).toLowerCase();switch(_s){case 'wed':$('textareaID2').style.display='block';break;case 'tue':$('textareaID').style.display='block';break;}">
    <option value=Mon $Mon>Mon</option>
    <option value=Tue $Tue>Tue</option>
    <option value=Wed $Wed>Wed</option>
    <option value=Thu $Thu>Thu</option>
    <option value=Fri $Fri>Fri</option>
    <option value=Sat $Sat>Sat</option>
    <option value=Sun $Sun>Sun</option>
</select>

<input type=submit value=Submit>
<textarea id="textareaID" cols="20" rows="20" style="display:none"></textarea>
<textarea id="textareaID2" cols="20" rows="20" style="display:none"></textarea>

</form>
</body>
</html>

Open in new window

what happen if textarea2 is open (Wed selected on the second select) and now you select Tue on the first select ?
Avatar of rgb192

ASKER

select2=wed
textarea2 is open

then
when select1=tue
textarea1 is open

so that part works
you can have two calendars open at the same time ?
Avatar of rgb192

ASKER

2 select menus

only want
1 textarea open at the same time
ASKER CERTIFIED SOLUTION
Avatar of leakim971
leakim971
Flag of Guadeloupe image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of rgb192

ASKER

thanks, works great
You're welcome! Thanks for the points!