Jump to content

Register/Checkout buttons don't do anything


Recommended Posts

Latest download, new install.

When filling out the registration form, when clicking the "Register" button (or the "Secure Checkout" button, on page 2 of the checkout process), nothing happens. Nothing at all. In Developer Tools, there's no network activity, no errors or notices in the console. I input 

$("#registration_form").trigger('submit'); 

into the console, but the form doesn't submit I just get back a jQuery reference 

_.fn.init [form#registration_form, context: document, selector: "#registration_form"]

which makes me wonder if there's some jQuery override happening on the submit event that sinks the event and returns the form object. I'm so close to done and ready to go live, but this issue has me completely stumped. Please help!

EDIT: I tracked the problem down to skins/mySkin/js/vendor/jquery.validate.js, on or about line 108 in this section:

if ( validator.form() ) {
	if ( validator.pendingRequest) {  << THIS LINE HERE IS THE PROBLEM
		validator.formSubmitted = true;
		return false;
	}
	return handle();
} else {
	validator.focusInvalid();
	return false;
}

validator.pendingRequest is always 1. If I negate that if statement with && false the form submits correctly. Naturally, disabling whatever form validation is going on is not the best course of action, but pendingRequest is set to one and never changed through the validation process. So what gives?

EDIT: upgraded jquery.validate.js to version 1.9. Same issue.

EDIT: Finally tracked down the issue, it's a problem inside jquery.validate.js. Starting at line 1535 you get 

$.ajax( $.extend( true, {
	mode: "abort",
	port: "validate" + element.name, 
	dataType: "json",
	data: data,
	context: validator.currentForm,
	success: function( response ) {
		var valid = response === true || response === "true",
			errors, message, submitted;
		validator.settings.messages[ element.name ][ method ] = previous.originalMessage;
		if ( valid ) {
			submitted = validator.formSubmitted;
			validator.resetInternals();
			validator.toHide = validator.errorsFor( element );
			validator.formSubmitted = submitted;
			validator.successList.push( element );
			validator.invalid[ element.name ] = false;
			validator.showErrors();
		} else {
			errors = {};
			message = response || validator.defaultMessage( element, { method: method, parameters: value } );
			errors[ element.name ] = previous.message = message;
			validator.invalid[ element.name ] = true;
			validator.showErrors( errors );
		}
		previous.valid = valid;
		validator.stopRequest( element, valid ); // << THIS RIGHT HERE IS WHAT WE NEED TO HAPPEN
	}
}, param ) );

The line "validate.stopRequest" is what should remove the validated elements from the stack, but it doesn't because the success method never fires. The validation is called more than a dozen times, returns a status of [canceled] until the very last time (returning a status of 200), but the success method doesn't fire, ever.

It is only by adding this method to the object:

complete: function(response){if(typeof response.responseText != 'undefined'){validator.stopRequest( element, (response.responseText == 'true') )};},

the the form will actually submit. I tried replacing the "success" method with "complete", but that doesn't work either. It's only when they are there together that it works. I don't understand. 

Edited by Bill in Kansas City
updating with more information
Link to post
Share on other sites

The comments at the top of the file jquery.validate.js suggest the version shipped with the Foundation skin in CC629 is:

 * jQuery Validation Plugin v1.17.0
 *
 * https://jqueryvalidation.org/
 *
 * Copyright (c) 2017 Jörn Zaefferer

You mention version 1.9. We ask that you verify. (Unless you mis-typed and meant 1.19.)

However, regardless, comparing the code snippets between the two versions reveals no changes. (The line numbers are different, so something changed.)

Just as an experiment, if possible, please verify the same behavior using a web browser different than the one you are currently using.

Edited by bsmither
Link to post
Share on other sites

Yes, I mean ver. 1.19.

Tried both in Chrome and Firefox, both updated to their latest versions. It is only after the complete method is added that the function works as it should.

$.ajax( $.extend( true, {
	mode: "abort",
	port: "validate" + element.name, 
	dataType: "json",
	data: data,
	context: validator.currentForm,
	/***** THIS LINE RIGHT HERE ****/
	complete: function(response){if(typeof response.responseText != 'undefined'){validator.stopRequest( element, (response.responseText == 'true') )};},
	/***** ^^^ THIS LINE RIGHT HERE ^^^^ ****/
	success: function( response ) {
		var valid = response === true || response === "true",
			errors, message, submitted;

		validator.settings.messages[ element.name ][ method ] = previous.originalMessage;
		if ( valid ) {
			submitted = validator.formSubmitted;
			validator.resetInternals();
			validator.toHide = validator.errorsFor( element );
			validator.formSubmitted = submitted;
			validator.successList.push( element );
			validator.invalid[ element.name ] = false;
			validator.showErrors();
		} else {
			errors = {};
			message = response || validator.defaultMessage( element, { method: method, parameters: value } );
			errors[ element.name ] = previous.message = message;
			validator.invalid[ element.name ] = true;
			validator.showErrors( errors );
		}
		previous.valid = valid;
		validator.stopRequest( element, valid );
	}
}, param ) );

 

Link to post
Share on other sites
Posted (edited)

With more research, I was able to address this issue like so:

$.ajax( $.extend( true, {
	mode: "abort",
	port: "validate" + element.name, 
	dataType: "text", // << CHANGE THIS VALUE FROM json TO text
	data: data,
	context: validator.currentForm,
	success: function( response ) {
		...

In this way, the success method is called correctly. (NOTE: the complete method is no longer needed.)

Edited by Bill in Kansas City
Link to post
Share on other sites

Well, it was too good to be true. Changing the datatype may work on the Register page, but on the new customer checkout page it causes the email validation to fail because the success method doesn't understand the response. So we're back to adding the complete method in order to decrement the validation stack.

Do the developers have anything to add? Surely I'm not the only person to encounter this issue? Is there a real fix for it?

Link to post
Share on other sites

As just one person who "unofficially" grinds through the code (PHP mostly, Smarty as a second, but javascript? - Not my forté), I can say that if this were a widely-experienced problem, it would have been dealt with a number of versions ago. Getting customers registered is one of the very key tasks CubeCart must do.

Your reports definitely show that your experience can be repeated - by you. As such, there is an invite to register with the CubeCart Github repository (https://github.com/cubecart/v6/issues). If it can be repeated by others, then there is a pitch we can play on.

 

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...