Users on a specific page must click a 'generate' button to create details for a record. When the button is clicked, an ajax request is triggered to generate the record, which may take some time.
$("#generate_record_button").on("click", function() {
$(this).addClass('disabled');
// Show loading messages and spinner
$.ajax({
url: "<generate-record-url/>",
method: 'get',
data: {id: <recordID>},
cache: false
}).success(function (data) {
// Handle success scenario
// Display success messages
// Remove spinner
}).fail(function (data) {
// Handle failure scenario
// Display error messages
// Remove spinner
$(this).removeClass('disabled');
});
});
In the code, the button becomes disabled after being pressed to prevent multiple ajax requests when continuously clicked. The intention is for users to press the button once and allow the ajax to manage the request.
Is it possible to check if the ajax request is still running when a user leaves the page (e.g., refreshes or navigates away)? If a user returns to the page while the ajax is processing the record, I want the button to remain disabled with loading messages displayed. Can this be achieved?