Ajaxify Mailchimp Signup

Totally worth it if you find the time.

I hope that drupal_set_message() is gone in D8 when the list is unavailable, and error response support has been added.

i.e. This always causes issues on live sites.

  if (empty($lists)) {
    drupal_set_message('The subscription service is currently unavailable. Please try again later.', 'warning');
  }

and 'There was a problem with your newsletter signup to %list.' is meaningless by default.

The ltrim($result->message, '0123456789: ') trims off the "400: " prefix off the error message, and I am guessing there are other response codes sent back.

      if (!empty($result->message)) {
        drupal_set_message(t('There was a problem with your newsletter signup to %list. The error returned was: %error', array(
          '%list' => $list_details[$list_id]->name,
          '%error' => ltrim($result->message, '0123456789: '),
        )), 'warning');
      }
      else {
        drupal_set_message(t('There was a problem with your newsletter signup to %list.', array(
          '%list' => $list_details[$list_id]->name,
        )), 'warning');
      }

I have attached a 7.x-4.x version I quickly hacked up for a client. It just returns the message, but you could optionally replace the entire form rather than just adding the message. Success shows the std confirmation message.

I took a new attempt to ajaxify Mailchimp form submit with this draft patch. A config variables is added to the signup form settings and used during form build.
The ajax submit handler introduced is still very raw and more result/feedback in the form would help to give more feedback in the ajax submit handler.

Reworked the ajax response a little to use core's ajax commands and response with error display.

Tested latest patch and works very good! Would love to see this committed.

The latest patch works really good for me as well, but I was facing a slightly different problem regarding the returned response.
In this case whether the form was submitted correctly or some validation error was returned, the response would simply replace the form entirely, thus the user needs to refresh the page once again.

So I simply tweaked the patch above by adding an additional empty element/container between the description field and the form itself and used it instead as a target element, so that the response gets printed in there and my form would still be intact.

Well, in our case we needed the status messages visible all the time, without having to replace the form. So, I ended up removing the functionality regarding replacing the form with status messages and simply use the newly added response container as a replacement for any status messages returned.
Now, we are able to freely modify in our custom template, the display order of the description, response and form.

The patch #8 is working great for me.

After testing the latest patch, I had a problem that the page jumps to another form because of the autorefocus in ajax.
I provide a new patch with adding disable-autorefocus to TRUE to stop this behavior.

I am re-uploading a tiny fix for the latest patch I've added (#8).
There was a wrong render key, that was left out in the original patch (#5) that I was basing my work on.
Instead of #postfix, it should've been #suffix and this was causing a break in the markup.

After using the AJAX submit a longer time, i faced an issue with the submit handler. When other forms are having the same ID on the submit button, the AJAX submit of Mailchimp is causing the other form to also use AJAX when they are not configured to act likt that.
This can be fixed by having the Mailchimp submit button to have it's own ID. Patch provided and started from #11 as this also fixes the issue of the auto-refocus.

Made a little mistake, adjusted patch.

The patch from #14 works mostly as expected. However, I changed some comments and added a class to the form to signify a posted status. This allows you to visually hide the form once it has been submitted.

Latest patch is working on the 1.8 branch without any issues, so would love to see this in the module.

The patch works fine with 1.10, however there is a notice when an old signup form has been created and not updated :
Notice: Undefined index: ajax_submit in Drupal\mailchimp_signup\Form\MailchimpSignupPageForm->buildForm() (line 90 of modules/contrib/mailchimp/modules/mailchimp_signup/src/Form/MailchimpSignupPageForm.php).

The updated patch solve this and fix the offset of the previous patch.

Going to be testing and hopefully committing this soon.

Here's a small tweak to clear form values if submission was successful, which mimics the behavior of the current form and should prevent double-submit.

Fixed tests.

Committed - thanks all!

I'm marking this as fixed since the patch was for D8, but if anyone has time to work on a 7.x-5.x backport please change the version of the issue to 7.x-5.x, upload your patch, and set the issue to "Needs review".

@samuel.morentson thanks for picking up older issues such as this!