Submit to make active variable

buckminster83 · 12-09-2012, 07:20 AM

Hi! New here, but was hoping to get this figured out in the next day or two.

I'm working on a project where the User enters a Zip code and on Submit, the Zip Code is available under the variable "zip".

I've been trying a lot of things, so either this coding is close or may not make sense at all. I'm using it to get the already stored "zip" from Yahoo's simpleWeather. At the bottom of this coding, the last line reads that I'm assigning "zip" the function "zipfx" in hope that "zip" will run the function which grabs the zip code entered from the form. I appreciate any help ASAP!

My current HTML:
<form name="zipSearch" action="" method="post">
<fieldset>
<input type="text" name="zipEntry" placeholder="Enter Zip Code" value=""/>
<input type="submit" name="zipSubmit" value="Search" onClick="zipfx()"/>
</fieldset>
</form>

My current JS:
function zipfx(){

var zipd= document.forms["zipSearch"]["zipEntry"].value;
return zipd;
}

var zip = zipfx();

---

AndrewGSW · 12-09-2012, 12:59 PM

Code:

var zip = zipfx();

This executes the function zipfx and assigns the return result to the variable zip. But it runs straight-away, before the form exists, so it returns an error as it cannot refer to forms['zipSearch'].

Code:

var zip = zipfx;

Assigns the function to the variable, so that it could be executed later by calling

Code:

zip();

FYI It is preferable and more modern to use IDs rather than names. In particular, form-names are deprecated/discouraged.

DaveyErwin · 12-09-2012, 01:49 PM

Maybe like this ...

Code:

 
<!doctype html>
<html>
<head>
<style>  
</style>
<script>
function zipfx(frm){  
 var zipid = frm.zipEntry.value;
 alert(zipid);
 return false;// prevents submit, return true to allow submit
}
</script>
</head>
<body>
 <form action="" method="post" onsubmit="return zipfx(this)">
  <fieldset>
   <input type="text" name="zipEntry" placeholder="Enter Zip Code" value=""/>
   <input type="submit" value="Search" />
  </fieldset>
 </form>
</body>
</html>