• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 352
  • Last Modified:

textarea to open in select choices

this code opens a textarea if user selects tue

I want the textarea to open if user selects tue or wed
<!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>
<script language="javascript">
  function chgDisplayTextarea(value, textarea, switchValue) {
    document.getElementById(textarea).style.display = (value.indexOf(switchValue)==0)?"block":"none";
  }
</script>
</head>
<body>
<form method="post" action="pb-dropck.php">
    <select name=t1 onchange="chgDisplayTextarea(this.value, 'textareaID', 'Tue')">
        <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>
</form>
</body>
</html>

Open in new window

0
rgb192
Asked:
rgb192
  • 3
  • 2
  • 2
  • +1
2 Solutions
 
Om PrakashCommented:
Try
<!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>
<script language="javascript">
  function chgDisplayTextarea(value, textarea, switchValue) {
    var word = switchValue.split(",")
    for(i=0; i < word.length ; i++)
    {
    if(value == word[i])
    {
		document.getElementById(textarea).style.display = "block";
		exit;
		}
	else
		document.getElementById(textarea).style.display = "none";

    }
  }
</script>
</head>
<body>
<form method="post" action="pb-dropck.php">
    <select name=t1 onchange="chgDisplayTextarea(this.value, 'textareaID', 'Tue,Wed')">
        <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>
</form>
</body>
</html>

Open in new window

0
 
ploftinCommented:
Use 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>
<script language="javascript">
  function chgDisplayTextarea(value, textarea) {
	switch(value) {
      case "Tue":
        document.getElementById(textarea).style.display = "block";
        break;
      case "Wed":
        document.getElementById(textarea).style.display = "block";
        break;
      default:
        document.getElementById(textarea).style.display = "none";
    }
  }
</script>
</head>
<body>
<form method="post" action="pb-dropck.php">
    <select name=t1 onchange="chgDisplayTextarea(this.value, 'textareaID')">
        <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>
</form>
</body>
</html>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
onchange="document.getElementById('textareaID').style.display=this.selectedIndex<2?'none':'block'"
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
rgb192Author Commented:
om_prakash_p
works
but I get javascript error
'exit' is undefined
0
 
ploftinCommented:
Try mine. It works, and no JavaScript errors.
0
 
Om PrakashCommented:
Use break instead of exit.
<!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>
<script language="javascript">
  function chgDisplayTextarea(value, textarea, switchValue) {
    var word = switchValue.split(",")
    for(i=0; i < word.length ; i++)
    {
    if(value == word[i])
    {
		document.getElementById(textarea).style.display = "block";
		break;
		}
	else
		document.getElementById(textarea).style.display = "none";

    }
  }
</script>
</head>
<body>
<form method="post" action="pb-dropck.php">
    <select name=t1 onchange="chgDisplayTextarea(this.value, 'textareaID', 'Tue,Wed')">
        <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>
</form>
</body>
</html>

Open in new window

0
 
rgb192Author Commented:
thanks
0
 
ploftinCommented:
My pleasure. Thanks for the points.
0

Featured Post

Upgrade your Question Security!

Add Premium security features to your question to ensure its privacy or anonymity. Learn more about your ability to control Question Security today.

  • 3
  • 2
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now