I am VERY new to Javascript.
I have been provided with some code, which will enable me to hide/show a text area and change a submit button dependant on a check box.
Expand|Select|Wrap|Line Numbers
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
- "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
- <head>
- <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/>
- <title>Untitled</title>
- <script type="text/javascript">
- //<![CDATA[
- function toggleSubmit(chkbox)
- {
- var submit = document.getElementById('submit');
- var textarea = document.getElementById('justification');
- submit.value = (chkbox.checked) ? 'Submit Emergency Change' : 'Submit to Change Control';
- textarea.style.display = (submit.value == 'Submit Emergency Change') ? 'block' : 'none';
- }
- //]]>
- </script>
- </head>
- <body>
- <form id="form1" action="#" method="post">
- <div>
- <label for="emergency">Emergency?: (yes)</label> <input id="emergency" name="emergency" type="checkbox" value="yes" onclick="toggleSubmit(this);"/>
- <br />
- <textarea id="justification" name="justification" cols="38" rows="3" style="display:none;"></textarea>
- <input id="submit" name="submit" type="submit" value="Submit to Change Control" />
- </div>
- </form>
- </body>
- </html>
This code works great, but I would like to alter it so that rather than a checkbox, selection is made by a selection list containing yes and no.
I have messed around with the code:
Code:
Expand|Select|Wrap|Line Numbers
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
- "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
- <head>
- <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/>
- <title>Untitled</title>
- <script type="text/javascript">
- //<![CDATA[
- function toggleSubmit(chkbox)
- {
- var submit = document.getElementById('submit');
- var textarea = document.getElementById('justification');
- submit.value = (chkbox.checked) ? 'Submit Emergency Change' : 'Submit to Change Control';
- textarea.style.display = (submit.value == 'Submit Emergency Change') ? 'block' : 'none';
- }
- //]]>
- </script>
- </head>
- <body>
- <form id="form1" action="#" method="post">
- <div>
- <label for="emergency">Emergency</label>
- <select name="emergency">
- <option value="No" >No</option>
- <option value="Yes" onchange="toggleSubmit(this);">Yes </option>
- </select>
- <br />
- <textarea id="justification" name="justification" cols="38" rows="3" style="display:none;"></textarea>
- <input id="submit" name="submit" type="submit" value="Submit to Change Control" />
- </div>
- </form>
- </body>
- </html>
I figure the following should be changed to reflect a select list:
Expand|Select|Wrap|Line Numbers
- function toggleSubmit(chkbox) submit.value = (chkbox.checked) ? 'Submit Emergency Change' : 'Submit to Change Control';
- textarea.style.display = (submit.value == 'Submit Emergency