...

View Full Version : html form messing up javascript



Jon W
07-26-2010, 06:09 AM
This is the weirdest thing I've come across in awhile. I have some code that formats a input field for a date format. This code runs fine on all browser when the form tag isn't wrapped around the inputs. The second I wrap the form tag around the inputs everything messes up. The Javascript error I'm getting is "Object doesn't support this property or method." on line 45 which is the line of the date input field. I'm totally clueless what I'm doing wrong here. And so I'll leave it up to you the wonderful community to give me some help.

Thanks,
Jon W




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html leng="en">
<head>
<script type="text/javascript">
function dob(val,e) {
if(e.keyCode != 8) {
if(val.length == 2 || val.length == 5) {
if(val.match(/[\/]$/) != "/") {
document.getElementById('dob').value += "/";
}
}
var regex = /[a-zA-Z]|\+|\-|\&|\\|\(|\)|\%\|\$|\#|\@|\*|\_|\?|\>|\<|\,|\./;
if(val.match(regex)) {
newStr = val.replace(regex,'');
document.getElementById('dob').value = newStr;
}
}
}
</script>
<style type="text/css">@import url(/css/home.css);</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="logo"><a href="/index.php"><img src="/images/logo.png" /></a></div>
</div>
<div id="container-arrow"></div>
<div id="container">
<img src="/images/no_image.png" />

<div id="sign-container">
<span class="sign-header">
Sign Up
</span>
<div id="sign-arrow-up"></div>
<div id="sign-content">
<form method="post" action="/account/index.php" name="sign">
<label for="email">Email</label><input name="email" class="sign-inputs" type="text" />
<p>
</p>
<label for="password">Password</label><input name="password" class="sign-inputs" type="password" />
<p>
</p>
<label for="dob">Date Of Birth</label>
<input type="text" name="dob" style="text-align:center;" maxlength="10" class="sign-inputs" id="dob" value="MM/DD/YYY" onkeyup="dob(this.value,event);" onkeydown="dob(this.value,event);" onfocus="if(this.value=='MM/DD/YYY') this.value='';" title="MM/DD/YYY" />
<p>
</p>
<input name="submit" type="submit" class="sign-submit" value="Sign Up" />
</form>
</div>
</form>
</div>
</div>
</div>
</body>
</html>

A1ien51
07-26-2010, 06:56 AM
IE uses window.event and does not get an event passed in.


function dob(val,e) {
e = e || window.event;
var key = e.keyCode || e.which;
if(key != 8) {


Eric

Jon W
07-26-2010, 07:55 AM
Hrmm... Thanks for the tip. However, I'm still having the same exact error as before.

Philip M
07-26-2010, 09:28 AM
You are using dob both as the name/id of a textfield and as the name of a function. :(

A child of five would understand this. Send someone to fetch a child of five.
Groucho Marx

Jon W
07-26-2010, 05:43 PM
Haha... Cool, that was the problem. Thanks for the help!

Jon W,



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum