Receiving NaN error and no date output
Not sure what my problem is. I'm trying to display the date in the "Order Placed" field, and have it calculate the total into the "Total" field. Frustrated and I could use some help.
<html>
<head>
<title>My Order Form</title>
<!-- Modified by: -->
<!-- This web page should display the current date in the txtDate
textbox on the form as well as calculate the order total and display
in the txtTotal textbox on the form. -->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<script language="javascript" type="text/javascript">
<!-- hide from old browsers
function enterDate() {
//reads, formats, then displays the current date in the txtDate textbox on the order form
var myDate = new Date();
var myMonthNum = myDate.getMonth();
var myDay = myDate.getDay();
var myYear = myDate.getYear();
var monthNames = new Array()
monthNames[0] = "Jan";
monthNames[1] = "Feb";
monthNames[2] = "Mar";
monthNames[3] = "Apr";
monthNames[4] = "May";
monthNames[5] = "Jun";
monthNames[6] = "Jul";
monthNames[7] = "Aug";
monthNames[8] = "Sep";
monthNames[9] = "Oct";
monthNames[10] = "Nov";
monthNames[11] = "Dec";
var myMonth = monthNames[myMonthNum];
var myNiceDate = myMonth + " " + myDay + ", " + myYear;
document.frmOrder.txtDate.value = myNiceDate;
}
function enterTotal (quantity, price) {
//calculates the price for each item, adds to existing totals, then displays in the txtTotal textbox
var myTotal = parseInt(window.document.frmOrder.txtTotal);
myTotal += (quantity * price);
window.document.frmOrder.txtTotal.value = myTotal;
}
// -->
</script>
</head>
<body onLoad="enterDate(); window.document.frmOrder.txtWidget.focus()">
<h1 align="center">Totally Useless Parts</h1>
<h2 align="center">Order Form</h2>
<hr>
<form action="mailto:email@email.com" method="post"
enctype="text/plain" name="frmOrder" id="frmOrder">
<table width="100%" border="0" cellspacing="0" cellpadding="5"
summary="Contains the form elements for the order form">
<tr valign="top">
<td> </td>
<td> </td>
<td><div align="right"></div></td>
<td><div align="right">Order Placed:
<input name="txtDate" type="text" id="txtDate"/>
</div></td>
</tr>
<tr valign="top">
<td>Item</td>
<td>Quantity</td>
<td> </td>
<td>Mail To: </td>
</tr>
<tr valign="top">
<td>Widgets </td>
<td><input name="txtWidget" type="text" id="txtWidget" size="4"
onChange="enterTotal(document.frmOrder.txtWidget, 4.99)"/>
(@ $4.99 each)</td>
<td> </td>
<td rowspan="5"><textarea name="txaAddress" cols="50" rows="6" id="txaAddress"></textarea></td>
</tr>
<tr valign="top">
<td>Gizmos</td>
<td><input name="txtGizmo" type="text" id="txtGizmo" size="4"
onChange="enterTotal(document.frmOrder.txtGizmo.value, 2.50)"/>
(@ $2.50 each) </td>
<td> </td>
</tr>
<tr valign="top">
<td>Thing-a-ma-jigs</td>
&l开发者_JS百科t;td><input name="txtThing" type="text" id="txtThing" size="4"
onChange="enterTotal(document.frmOrder.txtThing.value, 0.95)"/>
(@ $0.95 each) </td>
<td> </td>
</tr>
<tr valign="top">
<td colspan="2"><hr></td>
<td> </td>
</tr>
<tr valign="top">
<td align="right">Total:</td>
<td>$
<input name="txtTotal" type="text" id="txtTotal" value="0" onChange="enterTotal()"/>
(US) </td>
<td> </td>
</tr>
</table>
</form>
</body>
</html>
one problem I see is mydate used to get myDay; it should be myDate (case sensitive)
there are numerous other errors. perhaps you should be using the DOM to get all values from the form each change, otherwise the application will not be robust.
As Jayantha said, use Firebug, and I recommend also Firefox's Error Console. It will help nail down Javascript errors.
getDay() returns an integer representing the day of the week from 1 to 6.
getYear() returns the year minus 1900 and is deprecated. Use getFullYear() instead.
So, you could do something like this
var myDate = new Date(),
days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday',
'Thursday', 'Friday', 'Saturday'],
months =["Jan","Feb","Mar","Apr","May", "Jun",
"Jul","Aug","Sep","Oct","Nov","Dec"],
myNiceDate = months[myDate.getMonth()] + " " +
days[myDate.getDay()] + ", " +
myDate.getFullYear();
console.log(myNiceDate);
加载中,请稍侯......
精彩评论