I have a straightforward form to collect a person's details. It sends the data to firebase and I e.preventDefault()
to stop it from submitting normally. This is the handler;
let frm = document.forms[0];
frm.addEventListener('submit', function(e) {
e.preventDefault();
let formData = document.signup.elements;
formValues = getFormInfo(formData);
let submitted = writePupilRecord(formValues);
console.log(submitted);
removeForm();
formResponse();
return false;
});
This is the hard to figure out bit. It works in Chrome, Safari, Firefox, android, latest iPhone/iPad. It doesn't work in older ios browsers.
When I try it locally with the firebase server you get with firebase SDK I can see in the console the GET req when I navigate to localhost and on a working browser when I submit the form there is no HTTP request, as you would expect, because I have preventDefault()ed. But when I do it using XCode simulator with ios9 there is a second request to the server including the submitted data, as if no preventDefault() method is called.
Looking up my question I came across suggestions to add the return false;
to the callback func, but this made no difference.
Why is e.preventDefault() not working only on slightly older iPad/iPhone and what can I do to make it work? I use javascript to build the form in the first place and this still works in older ios.