I have the following script which uses an ajax script to update records in a database.

Code:
	
// Action to run on submit to add/edit/delete record from database
var request; // variable to hold request

// bind to the submit event of our form
$("#form_edit").submit(function(event) {
// abort any pending request
if (request) {
request.abort();
}

// setup local variables
var $form = $(this);

// select and cache all the fields
var $inputs = $form.find("input, select, textarea");

// serialize the data in the form
var serializedData = $form.serialize();

// disable the inputs for the duration of the ajax request
$inputs.prop("disabled", true);
	
// define values to be passed as parameters
if (event.originalEvent.explicitOriginalTarget.id == "buttonAdd") {
var updateType = 'add';
} else if ( event.originalEvent.explicitOriginalTarget.id == "buttonEdt" ) {
var updateType = 'edt';
} else if ( event.originalEvent.explicitOriginalTarget.id == "buttonDel" ) {
var updateType = 'del';
} else {
var updateType = "";
}
var tableName  = $('#tableName').val(); //"phasecodes";
var indexName  = $('#tableIndex').val(); //"phase_ID";
var idxNumber  = $('#indexNumber').val(); //phase_ID.value;

// Build string for query input
var type   = "?type="  + updateType;
var table  = "&table=" + tableName;
var index  = "&index=" + indexName;
var rec	= "&rec="   + idxNumber;
var getS   = type + table + index + rec;

// execute request to update database
request  = $.ajax({
type : "post",
data : serializedData,
url  : "files_json/update_Record.php" + getS
});

// callback handler called on success
request.done(function (response, textStatus, jqXHR) {
console.log("Data record updated!"); // log success message to the console
});

// callback handler called on failure
request.fail(function (jqXHR, textStatus, errorThrown) {
console.error( "The following error occured: " + textStatus, errorThrown ); // log the error to the console
});

// callback handler called regardless if the request failed or succeeded
request.always(function () {
$inputs.prop("disabled", false); // reenable the inputs
});

// prevent default posting of form
event.preventDefault();

// Return menus to normal state after update
hideMenus();
As is the code works just the way I want it to. The parameters to build the $_GET part of the URL work as needed.

But, if I move the above code to the validate submitHandler (where it should be) as follows it does not work.

Code:
		submitHandler: function(form) {
			// setup local variables
			var $form = $(form);
					
			// select and cache all the fields
			var $inputs = $form.find("input, select, button, textarea");
			
			// serialize the data in the form
			var serializedData = $form.serialize();
		
			// disable the inputs for the duration of the ajax request
			$inputs.prop("disabled", true);
							
			// define values to be passed as parameters
			if (event.originalEvent.explicitOriginalTarget.id == "buttonAdd") {
				var updateType = 'add';
			} else if ( event.originalEvent.explicitOriginalTarget.id == "buttonEdt" ) {
				var updateType = 'edt';
			} else if ( event.originalEvent.explicitOriginalTarget.id == "buttonDel" ) {
				var updateType = 'del';
			} else {
				var updateType = "";
			}
			var tableName  = $('#tableName').val(); //"phasecodes";
			var indexName  = $('#tableIndex').val(); //"phase_ID";
			var idxNumber  = $('#indexNumber').val(); //phase_ID.value;
		
			// Build string for query input
			var type   = "?type="  + updateType;
			var table  = "&table=" + tableName;
			var index  = "&index=" + indexName;
			var rec	= "&rec="   + idxNumber;
			var getS   = type + table + index + rec;
			
			// execute request to update database
			request  = $.ajax({
				type : "post",
				data : serializedData,
				url  : "files_json/update_Record.php" + getS
			});
		
			// callback handler called on success
			request.done(function (response, textStatus, jqXHR) {
				console.log("Data record updated!"); // log success message to the console
			});
		
			// callback handler called on failure
			request.fail(function (jqXHR, textStatus, errorThrown) {
				console.error( "The following error occured: " + textStatus, errorThrown ); // log the error to the console
			});
		
			// callback handler called regardless if the request failed or succeeded
			request.always(function () {
				$inputs.prop("disabled", false); // reenable the inputs
			});
		
			// prevent default posting of form
			//event.preventDefault();
			
			// Return menus to normal state after update
			hideMenus();
		} // End of submitHandler
What am I doing wrong?

TIA for any assistance
jdadwilson