I am trying to get a form which asks for input and then asks the user to confirm it before proceeding. I am having an issue with iPhone 5 where the keyboard doesn't disappear after the user presses return, and the keyboard covers the confirmation window.
I've used the solution posted on another question (the solution is to blur the input) to get the keyboard to disappear on most pages. However, in this case, the "Confirm" dialogue shows up before the input is blurred, regardless of when I call the hideKeyboard function.
This is the code:
<form name="pay" method="POST" onsubmit="hideKeyboard(); return doSubmit('Are you sure you want to transfer', $('#amount'));" action="{{link_to_next_step}}">
var hideKeyboard = function() {
document.activeElement.blur();
$("input").blur();
};
function doSubmit(text1, text2, form) {
hideKeyboard();
$('input:text').each(function() {
var value = $(this).val();
$(this).val(value.replace(/\,/i, '.'));
});
if (isNaN(parseFloat($('input:text').val()))) {
document.getElementById('err_zero').style.display = 'block';
return false;
} else if (confirm(text1 + parseFloat($('input:text').val()).toFixed(2))) {
return true;
} else {
return false;
}
}
Any help is appreciated.
Edit: I've checked similar answers, and making the keyboard disappear is not the problem I'm having. The issue is that the code to deselect the input field only runs after the "Confirm" dialogue is resolved.