Hey everyone,
does anyone know how to disable the "continue to" button on the checkout pane where the login is until a user has entered a mail and the ajax callback was send?

If he did not enter a mail or he entered a mail and clicks directly on the continue there comes an ajax error..

have nice easterdays!

Comments

tommy kaneko’s picture

It looks like you need custom jQuery to do that. I don't have time right now, but have a look at the following articles to help you write a custom solution:
http://stackoverflow.com/questions/5614399/disabling-submit-button-until...
http://stackoverflow.com/questions/4473173/how-can-i-disable-a-drupal-fo...

You'll need to think about all possible situations:
- the user is already logged in, so email entry is not required.
- the user's email address does not exist on the system.
- the user's email address does exist on the system and is not logged in.

Good luck

IckZ’s picture

Hey Tommy Kaneko!
Thanks for your reply!
I think about disabeling the continue button by default. This should be done around line 23..

After that we should send a second ajax callback with the normal one (after the user has filled in the mailadress) but I dont know how to add two callbacks to one $form element.. Maybe with #attached?

I think with this solution every possible situation would be considered.

Today evening I will have a second look at this...

versatil’s picture

I haven't run into this problem but I can imagine it.

Sorry to say that I'm far from proficient in Drupal, let alone Drupal Commerce. I didn't quite get a grasp for how the ajax + forms were working so what I wound up doing for other pages is using Checkout Extra Panes module to insert a node with whatever JavaScript I wanted (not for this particular bug/problem, though). As much fun as that was it makes

Is there a way in Drupal to disable/enable submit buttons in regards to validation? E.g. if these fields have not passed validation via ajax they shouldn't be able to submit in the first place? This should be applied to both the Login Now button as well as the Continue button.

IckZ’s picture

Hey there!
I'm sorry but I didn't get this.. I can set the button to disabled but I cant figure out how to reenable it after the callback has checked the mail...

edit: its nothing but here the line to disable the button.. cant get in mind how to include the js..

$form['buttons']['continue']['#disabled'] = true;

versatil’s picture

Check out the AJAX parameter for form elements:

http://api.drupal.org/api/drupal/includes%21ajax.inc/group/ajax/7

Hypothetically you just change the form in the place that the ajax is being assigned, i.e. button disable/enable, and in the custom ajax callback you return the form element/field/whatever that was already updated in the previous function. Then Drupal's AJAX framework updates the HTML/JavaScript just based on that.

In other words you don't even touch JavaScript! It's pretty impressive. Like I said before I don't quite get it myself just yet but I think that would be the route to go.

It's used in the code for this module already so you have a working example to play with.

versatil’s picture

This brings up another usability issue I just remembered... user punches in e-mail address...goes to e-mail address field... leaves... and it does a check on the e-mail refreshing the form even if they didn't change anything. That's a usability no-no. After you figure this one out we can patch that up, too, pretty easily probably.

marcoka’s picture

confirmed.

1.)enter a already registered mail
2.)password field appears
3.)click somewhere outside of the field
4.)rechecking already checked mail

is there a way to check "if field value has changed" using ajax?

IckZ’s picture

Gday!
Does anybody has a working solution yet? I tried different things but I do not get this working :(

pravat231’s picture

Assigned: Unassigned » pravat231
Status: Active » Fixed

try to add the below javascript into a .js file and add it to the commerce_checkout_login.info file like scripts[] = .js

jQuery(document).ajaxStart(function() {
if(jQuery("#commerce-checkout-form-guest-user-checkout").length ){
jQuery("#edit-continue").attr('disabled','disabled');
}
});
jQuery(document).ajaxStop(function() {
if(jQuery("#commerce-checkout-form-guest-user-checkout").length ){
jQuery("#edit-continue").removeAttr("disabled");
}
});

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.