Snippets Html
Html
Using Javascript and php to preview form selections
by: Jenny Knowles
|
March 15, 2001
Version: 1.1
Type: Sample Code (HOWTO)
Category: HTML
License: GNU General Public License
Description: When a value in a drop-down box is changed, a window will open showing the user the selection. Useful for showing the effect of a selection before the form submits data to the database.
<head>
<script language="JavaScript">
//this finds the value currently selected in the drop-down box
function processFormE1(form) {
var titlebgcolorChoice = form1.titlebgcolor.options[document.form1.titlebgcolor.selectedIndex].value;
//processes the string to be inserted in the url because of special characters like #
titlebgcolorChoice = escape(titlebgcolorChoice);
//constructs the url by adding the variable to the page string
var goTo = "preview.php3" + "?titlebgcolorChoice=" + titlebgcolorChoice;
//opens the constructed url in a new browser window
window.open(goTo);
}
</script>
</head>
<body>
<form name="form1" method="post" action="adtemplate.php3">
<table width="90%" border="1" cellpadding="0" bordercolor="#000000">
<tr>
<td width="27%" height="48"><font face="Arial, Helvetica, sans-serif" size="2">Choose
Background Color</font></td>
<td width="73%" height="48">
<select name="titlebgcolor" size="1" onChange="processFormE1(this.form);">
<option value="#000000">Black</option>
<option value="#FFFFFF">White</option>
<option value="#CC3333">Red</option>
<option value="#993333">Deep Red</option>
<option value="#CC99CC" selected>Light Purple</option>
<option value="#996699">Purple</option>
<option value="#663366">Deep Purple</option>
<option value="#FF00CC">Light Pink</option>
<option value="#CC0099">Pink</option>
<option value="#990066">Deep Pink</option>
<option value="#0066CC">Light Blue</option>
<option value="#003399">Blue</option>
<option value="#003366">Deep Blue</option>
<option value="#00CC66">Light Green</option>
<option value="#009966">Green</option>
<option value="#006633">Deep Green</option>
<option value="#FFFF99">Light Yellow</option>
<option value="#FFFF66">Yellow</option>
<option value="#FFFF33">Deep Yellow</option>
</select>
</td>
</tr>
</table>
Then a new file called preview.php3:
<body>
<?php
if ($titlebgcolorChoice)
{
echo "<table width='50'><tr><td bgcolor='$titlebgcolorChoice'> </td></tr></table>";
}
else
{
echo "Error";
}
?>
</body>
you can use this with multiple form elements and use an elseif statement in preview.php3 to print the other possible variables that may be passed by the javascript functions.
PHPBuilder
Policies
PHP Developer
Topics
PHP Developer
Resources
PHP Developer
References
