Edit Question - KnowledgeHub

Title Body

Following on from a p revious question where I asked about disabling a submit button until all ajax calls have finished returning... It seems that people are still managing to submit the form even with the button disabled and a warning sign. I guess it could be from pressing 'enter' in a text input. How do I go about disabling the whole form, rather than just the submit button? The code so far is: // if we're waiting for any ajax to complete we need to disable the submit $(document).ajaxStart(function() { $(".ajaxbutton").attr("disabled", "disabled"); // if it's taken longer than 250ms display waiting message timer = setTimeout(function() { $('#processingAlert').html(' ...please wait one moment'); $('#processingAlert').show(); }, 250); }) $(document).ajaxComplete(function() { $(".ajaxbutton").removeAttr("disabled"); $('#processingAlert').hide(); // cancel showing the message when the ajax call completes. clearTimeout(timer); }); One other thing that I should mention which could be causing a problem is that there are multiple ajax calls happening at the same time, EG one div receives hidden inputs and another div elsewhere on the page shows a price total for instance. Would the fact that some ajax calls are completing quickly negate the disabling effect of ajaxStart? EG ajax call1 and ajax call2 both fire the ajaxStart - call1 finishes really quickly, would it re-enable the form while we are waiting for call2 to complete? Is there a better way of doing this where we could simply test if ALL ajax calls have completed?

Tags (comma-separated) Cancel