|
|
|
|
|
|
| |
Here is an example of using dynamic forms with javscript to make an adaptable form that can change based on user input
| <html>
<head>
<title>Demo</title>
<script language="javascript">
function show_row(){
// Make sure the element exists before calling it's properties
if ((document.getElementById("police_response1") != null)&&(document.getElementById("police_response2") != null))
// Toggle visibility between none and inline
if ((document.getElementById("police_response1").style.display == 'none')&&(document.getElementById("police_response2").style.display == 'none'))
{
document.getElementById("police_response1").style.display = 'inline';
document.getElementById("police_response2").style.display = 'inline';
document.getElementById("Inc_Police_Called").checked = true;
} else {
document.getElementById("police_response1").style.display = 'none';
document.getElementById("police_response2").style.display = 'none';
document.getElementById("Inc_Police_Called").checked = false;
}
}
</script>
<body>
<form name="test" action="" method="post">
<table>
<tr>
<td width="50%" align="right" height="23" valign="top">Police Notified:</td>
<td height="23" >
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD><INPUT TYPE='radio' NAME='Inc_Police_Called' ID='Inc_Police_Called' VALUE='1' onClick="show_row();">Yes</TD>
<TD><INPUT TYPE='radio' NAME='Inc_Police_Called' ID='Inc_Police_Called' VALUE='0' onClick="show_row();">No</TD>
</TR>
</TABLE>
</td>
</tr>
<tr id="police_response1" name="police_response1" style="display:inline;">
<td align="right">Response Time:</td>
<td>
<SELECT NAME='Incident_Police_Response' ID='Incident_Police_Response'>
<option value='00'>00</option>
<option value='05'>05</option>
<option value='10'>10</option>
<option value='15'>15</option>
<option value='20'>20</option>
<option value='25'>25</option>
<option value='30'>30</option>
<option value='35'>35</option>
<option value='40'>40</option>
<option value='45'>45</option>
<option value='50'>50</option>
<option value='55'>55</option>
<option value='60'>60</option>
<option value='75'>75</option>
<option value='90'>90</option>
<option value='105'>105</option>
<option value='120'>120</option>
</SELECT>
</td>
</tr>
<tr id="police_response2" name="police_response2" style="display:inline;">
<td align="right">Report Number:</td>
<td><INPUT TYPE='textbox' SIZE='15' NAME='inc_police_report_num' ID='inc_police_report_num' VALUE='745656'></td>
</tr>
</table>
</form>
</body>
</html> | | |
|
| Form Processing : with alert Highlight field name which is not filled by user Categories : Java Script, Form Processing, Data Validation, Beginner Guides, Web Design | | | Conditional Check - a script that allows a user to submit a form only if the user check a checkbox. Categories : HTML, Java Script, Form Processing, Beginner Guides | | | PHP and javascript mouseover, mouseout, and mousedown events Categories : PHP, Java Script, Form Processing, Beginner Guides | | | Changing the Style of form objects using the JavaScript OnClick method. Categories : Java Script, Form Processing, Beginner Guides, CSS | | | JavaScript dropdown list menu to switch any page. Categories : Java Script, Beginner Guides, Form Processing | | | Basic Authentication with sessions Categories : PHP, Beginner Guides, Authentication, Form Processing, Sessions | | | Javascript URL and Email Validation Categories : Java Script, Data Validation, Form Processing, Email, URLs | | | Simple Javascript CSS Digital Clock Categories : Java Script, Date Time, CSS, Beginner Guides, Web Design | | | Hilight Form Element onFocus Categories : Java Script, Form Processing, CSS | | | Db_lib - practical example usage of database abstraction and form validation.
Categories : PHP, Form Processing, PHP Classes, Data Validation, Beginner Guides | | | Easy alert box pop-up function Categories : PHP, Java Script, Beginner Guides | | | Adding a Filter to a Text Element Categories : Java Script, Data Validation, Form Processing | | | Simple PHP Form Field Generator Categories : PHP, Beginner Guides, Form Processing, HTML and PHP | | | Validating a URL with JavaScript RegExp Categories : Java Script, Data Validation, Beginner Guides | | | Form validations using javascript and including all validations in one message Categories : HTML and PHP, Java Script, Form Processing | |
| | | | Brian Tafoya wrote : 1330
Good thinking... just be warning this is only IE comparable. :)
| | | | bastien koert wrote :1331
Tafoya Brian,
Did you try it on FF? Since it works just great, I am not sure what mean about `it only works on IE`
| |
|
|
|