Jamey Phillips Jamey Phillips - 1 year ago 34
HTML Question

I have a form with the submit button linked to javascript function but nothing is happening when I click the submit button

I'm trying to make a form which when I click the submit button will send the information from the form fields to a javascript function and then show the results to the user. I've made something like this before that's very similar and works fine, but for some reason this isn't doing anything when I click submit. I must have missed something. Here's the code:

<!doctype html>
<meta charset="UTF-8" >
<title>Javascript Form</title>


<form id="formID" name="myform" action="" method="get">

Customer Name:
<input type="text" name="names" value="">

Street Address:
<input type="text" name="street" value="">

<input type="text" name="city" value="">

<input type="text" name="state" value="">

Zip Code:
<input type="text" name="zip" value="">

Beginning Odometer Reading:
<input type="text" name="beginO" value="">

Ending Odometer Reading:
<input type="text" name="edinO" value="">

Number of Days Car was Used:
<input type="text" name="days" value="">

<input type="button" name="button" value="Submit" onClick="car(this.form)">

<script type="text/javascript">
function car(form) {
var names = form.names.value;
var street = form.street.value;
var city = form.city.value;
var state = form.state.value;
var zip = form.zip.value;
var beginO = form.beginO.value;
var endO = form.endO.value;
var days = form.days.value;

var miles = endO - beginO;
var charge = days * 15 + miles * 0.12;

alert("Miles driven: " + miles + ". Charge: " + charge + ". Name: " + names + ". Address : " + street + " , " + city + " " + state + " " + zip + ". ");

Answer Source

It's because you have a JavaScript error at this line:

var endO = form.endO.value;

You have a typo in your form element name:

<input type="text" name="edinO" value="">

form.endO is undefined, so getting value throws an error.