Loading form within div when submit is pressed

JavaScript
1

Hi,

I have the form loading within a div tag, when I click submit it loads url as includes/add-customer.php… instead of loading within the div tag?


	<script type="text/javascript">

	$('form.ajax').on('submit', function() {
						
		var that = $(this),
		    url = that.attr('action'),
			type = that.attr('method'),
			data ={};
			
			that.find('[name]').each(function(index, value) {
				var that = $(this),
					name = that.attr('name'),
					value = that.val();
						
			data[name] = value;
	});

	$.ajax({
		url: url,
		type: type,
		data: data,
		success: function(responce) {
			console.log(responce);
		}
	});
	
	return false;
	
});

</script>

Form:


<form class="ajax" action="includes/add-customer.php" method="post">
<table width="500" border="0" align="center" cellpadding="5" cellspacing="0">
  <tr>
    <td height="17" colspan="5" align="center" class="heading">'.$state.'</td>
  </tr>
  <tr>
    <td width="38%" align="right" class="heading1">Customer:</td>
    <td width="62%" align="left"><input type="text" name="customer" id="customer" value="'.$customer.'" size="35"></td>
  </tr>
  <tr>
    <td align="right" class="heading1">Contact:</td>
    <td align="left"><input type="text" name="contact" id="contact" value="'.$contact.'" size="35"></td>
  </tr>
  <tr>
    <td align="right" class="heading1">Phone:</td>
    <td align="left"><input type="text" name="phone" id="phone" value="'.$phone.'" size="35"></td>
  </tr>
  <tr>
    <td align="right" class="heading1">Email:</td>
    <td align="left"><input type="text" name="email" id="email" value="'.$email.'" size="35"></td>
  </tr>
  <tr>
    <td align="right" class="heading1">Address</td>
    <td align="left"><input type="text" name="address" id="address" value="'.$address.'" size="35"></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td align="left">&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td align="left">
    <input type="hidden" name="customerID" value="'.$_REQUEST['customerID'].'" />
    <input type="hidden" name="edit" value="'.$_REQUEST['edit'].'" />
    <input type="submit" value="submit"></td>
  </tr>
</table>
</form>

Thanks

2

How is the script organised in relation to the form? Do you have the script running before the form has a chance to exist?