I was recently trying to make use of the ajaxForm plugin from jquery to handle my form submission success/error (which is retrieved from a netlify function in the back end). Everything worked locally using the netlify CLI and I was able to handle the return value from form submission to display a nice alert box informing the user.
However whenever I deployed, the ajax|Form would simply cease to work, instead after form submission I would be taken to a new page displaying the JSON result from the netlify function (e.g. success: True).
It took me far too long to figure out what was going on so this post is just to hopefully save someone else some time. The script tag that imported the jquery form plugin was pointing to this URL:
https://malsup.github.com/jquery.form.js
However, what should be used is this URL:
https://malsup.github.io/jquery.form.js
They both point to the same javascript but the first one appears to get redirected to the second one (which has the newer github url format) via a HTTP, not HTTPS, intermediary and therefore gets blocked by Netlify. Again, this only happens when deployed, not when testing locally.
That’s all.
