So the default form is placed by Shopify using the following liquid:
{%- form 'customer_login' -%}
I have created this hidden div for the Ajax response from /account/login:
<div id="responseDiv" style="display: none"> </div>
Here’s the Ajax Script:
var frm = $('#customer_login');
frm.submit(function (e) {
e.preventDefault();
$.ajax({
type: frm.attr('method'),
url: frm.attr('action'),
data: frm.serialize(),
success: function (data) {
$('#responseDiv').html(data);
if($. ('#responseDiv .errors').length > 0){
console.log("ERRORS FOUND").
} else {
location.reload();
}},});});
With this script there’s a couple of issues when the form has errors, I’m quite new to JavaScript and would greatly appreciate it if anyone can provide/ helms me find a better way to achieve what I’m trying to do, thanks in advance.