?
Solved

textarea to open in select choices

Posted on 2010-09-06
8
Medium Priority
?
338 Views
Last Modified: 2012-06-22
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
Comment
Question by:rgb192
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
  • 2
  • +1
8 Comments
 
LVL 22

Expert Comment

by:Om Prakash
ID: 33612790
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
 
LVL 5

Accepted Solution

by:
ploftin earned 1000 total points
ID: 33612831
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
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 33612838
onchange="document.getElementById('textareaID').style.display=this.selectedIndex<2?'none':'block'"
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 

Author Comment

by:rgb192
ID: 33613012
om_prakash_p
works
but I get javascript error
'exit' is undefined
0
 
LVL 5

Expert Comment

by:ploftin
ID: 33614363
Try mine. It works, and no JavaScript errors.
0
 
LVL 22

Assisted Solution

by:Om Prakash
Om Prakash earned 1000 total points
ID: 33614736
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
 

Author Closing Comment

by:rgb192
ID: 33657622
thanks
0
 
LVL 5

Expert Comment

by:ploftin
ID: 33658511
My pleasure. Thanks for the points.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
Password hashing is better than message digests or encryption, and you should be using it instead of message digests or encryption.  Find out why and how in this article, which supplements the original article on PHP Client Registration, Login, Logo…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
Suggested Courses

765 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question