Make a copy of the order form from lab exercise 4 and name it l6p3.php. Remove t
ID: 3761467 • Letter: M
Question
Make a copy of the order form from lab exercise 4 and name it l6p3.php. Remove the JavaScript code to calculate the total price. Add JavaScript code to produce an error message and suppress submission of the form if any quantity field contains non-numeric data. (It's OK for a quantity to be empty, but if it's non-empty, it must have only numbers.) Add an action= attribute to your
tag to submit the form to http://weblab.spsu.edu/formtest.php. Test that the form is submitted correctly when the quantities are numeric or empty, and that an error message is produced otherwise. (Regular expressions are your friend. Anything that's not a digit is bad. What is the predefined class for non-digits?) Add to your index page a link to your new order form.
<h2> Welcome to the Fruit Delivery Processing System </h2>
<form action = "http://weblab.kennesaw.edu/formtest.php">
<p>
<label> Buyer's Name:
<input type = "text" name = "name" size = "30" /> </label>
<br />
<label> Street Address:
<input type = "text" name = "street" size = "30" /> </label>
<br />
<label> City, State, Zip:
<input type = "text" name = "city" size = "30" /> </label>
<br />
<p />
<table>
<tr>
<th> Product </th>
<th> Price </th>
<th> Quantity </th>
</tr>
<tr>
<td> Bananas </td>
<td> $1.00 </td>
<td> <input type = "text" name = "bananas" size "2" />
</td>
</tr>
<tr>
<td> Lemons </td>
<td> $0.30 </td>
<td> <input type = "text" name = "lemons" size "2" />
</td>
</tr>
<tr>
<td> Oranges </td>
<td> $1.50 </td>
<td> <input type = "text" name = "oranges" size "2" />
</td>
</tr>
</table>
<p />
<h3> Payment Method: </h3>
<p>
<label><input type = "radio" name "payment" value = "visa" checked = "checked"/> Visa </label>
<br />
<label><input type = "radio" name "payment" value = "mc"/> MasterCard </label>
<br />
<label><input type = "radio" name "payment" value = "ae"/> American Express </label>
<br />
</p>
<p>
<input type = "button" value = "Total Cost" />
<input type = "submit" value = "Submit Order" />
<input type = "reset" value = "Clear Form" />
</p>
</form>
Explanation / Answer
Try using the function isNaN it should check if a variable is a number or not and return either true or false.
Example:
--------------------------------------...
var Number //put input into this variable
if (isNaN(Number)==true)
{
if (confirm("This is not a number. Continue"))
{
return(true)
}
else
{
return(false)
}
}
Thats a rough code, but just use isNaN and try a confirm prompt.
i providing you the example that how Add to your index page a link to your new order form
Testform.html:
<h2> Welcome to the Fruit Delivery Processing System </h2>
<form action = "http://weblab.kennesaw.edu/formtest.php">
<p>
<label> Buyer's Name:
<input type = "text" name = "name" size = "30" /> </label>
<br />
<label> Street Address:
<input type = "text" name = "street" size = "30" /> </label>
<br />
<label> City, State, Zip:
<input type = "text" name = "city" size = "30" /> </label>
<br />
<p />
<table>
<tr>
<th> Product </th>
<th> Price </th>
<th> Quantity </th>
</tr>
<tr>
<td> Bananas </td>
<td> $1.00 </td>
<td> <input type = "text" name = "bananas" size "2" />
</td>
</tr>
<tr>
<td> Lemons </td>
<td> $0.30 </td>
<td> <input type = "text" name = "lemons" size "2" />
</td>
</tr>
<tr>
<td> Oranges </td>
<td> $1.50 </td>
<td> <input type = "text" name = "oranges" size "2" />
</td>
</tr>
</table>
<p />
<h3> Payment Method: </h3>
<p>
<label><input type = "radio" name "payment" value = "visa" checked = "checked"/> Visa </label>
<br />
<label><input type = "radio" name "payment" value = "mc"/> MasterCard </label>
<br />
<label><input type = "radio" name "payment" value = "ae"/> American Express </label>
<br />
</p>
<p>
<input type = "button" value = "Total Cost" />
<input type = "submit" value = "Submit Order" />
<input type = "reset" value = "Clear Form" />
</p>
</form>
2. set_formval.html:
<HTML>
<HEAD>
<TITLE>Test Input </TITLE>
<SCRIPT LANGUAGE="JavaScript">
function readText (form) {
TestVar =form.inputbox.value;
alert ("You typed: " + TestVar);
}
function writeText (form) {
form.inputbox.value = "Have a nice day!"
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="myform" ACTION="" METHOD="GET">
Enter something in the box: <BR>
<INPUT TYPE="text" NAME="inputbox" VALUE=""><P>
<INPUT TYPE="button" NAME="button1" Value="Read">
<INPUT TYPE="button" NAME="button2" Value="Write">
</FORM>
</BODY>
</HTML>
.3. form_radio.html
<HTML>
<HEAD>
<TITLE>Radio Button Test</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function testButton (form){
for (Count = 0; Count < 3; Count++) {
if (form.rad[Count].checked)
break;
}
alert ("Button " + Count + " is selected");
}
</SCRIPT>
</BODY>
<FORM NAME="testform">
<INPUT TYPE="button" NAME="button" Value="Click"
> <BR>
<INPUT TYPE="radio" NAME="rad" Value="rad_button1"> <INPUT TYPE="radio" NAME="rad" Value="rad_button2"> <INPUT TYPE="radio" NAME="rad" Value="rad_button3"> </FORM>
</HTML>
4. form_check.html
<HTML>
<HEAD>
<TITLE>Checkbox Test</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function testButton (form){
alert (form.check1.checked);
}
</SCRIPT>
</BODY>
<FORM NAME="testform">
<INPUT TYPE="button" NAME="button" Value="Click"
><BR>
<INPUT TYPE="checkbox" NAME="check1" Value="Check1">Checkbox 1<BR>
<INPUT TYPE="checkbox" NAME="check2" Value="Check2">Checkbox 2<BR>
<INPUT TYPE="checkbox" NAME="check3" Value="Check3">Checkbox 3<BR>
</FORM>
</BODY>
</HTML>
As with the radio button object, add a CHECKED attribute to the HTML markup for that check box you wish to be initially check when the form is first loaded.
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.