Disable browser button until page finish loading

Question

I have an apex application but because the form page has so much data to render from individual record and sometimes if you don't have the patient to wait for that extra 2-6 seconds you sometimes click on the browser back button a button in the application and if you click on either of them. you will get an error from the application.

Apex does support jquery, if you didn't know.

I wanted to add a Javascript which disable any buttons including the browser buttons until a page in my application finish loading.

I did some search on google and none of them show a decent solution.

I have try anything yet because I have no idea how to do it. I have very limited knowledge of Jquery.

You help will mean alot

thanks

Redesign the application to provide meaningful feedback to the user? — roblarsen, Dec 06 '13 at 16:47

score 1 · Answer 1 · answered Dec 06 '13 at 16:50

1

The ideal method is to display a modal popup dialog on the screen that prevents user from clicking anything on the screen.

jQuery UI Modal Dialog demo: http://jqueryui.com/resources/demos/dialog/modal.html

And in that modal, show something like, "Loading page. Please wait."

And no, you cannot disable browser buttons. Its a no-no.

answered Dec 06 '13 at 16:50

naveen

53,448
46
161
251

Modal is not going to prevent them from clicking the browser buttons! – epascarello Dec 06 '13 at 16:53
did i not mention that in the answer. I said, it cannot be done. And to me, its an answer :) – naveen Dec 06 '13 at 16:57
I think it is a good one. The problem seems to be that the user thinks it has hung up. Providing loading feedback seems like a reasonable solution. – Tim Seguine Dec 06 '13 at 16:58

Tim Seguine · Answer 2 · 2013-12-06T18:51:47.913

You don't actually want to be able to disable browser buttons. That would mean anyone can. Imagine an attack site that did this. That would be a nightmare.

The closest thing you can do is to bind on beforeunload, but that probably won't help so much. Otherwise make the backend handle this better.

I think naveen's answer is good. That is something you should consider implementing, but I think it is a good idea to make the backend resilient to user impatience anyway. In this case it might be good to allow the data to be progressively loaded, or at least make it not throw errors when the navigation gets cancelled. I don't know your system design, so I can't really make specific recommendations in that regard.

score 0 · Answer 3 · answered Dec 06 '13 at 16:56

It is not possible to disable browser buttons, but you can add code to disable inputs in the client/server side.

Disable in HTML:

<button id="mybutton" disabled="disabled"></button>

Disable in javascript:

document.getElementById('mybutton').disabled=true;

Disable with jQuery:

$("#mybutton").attr("disabled","disabled");

Override window unload:

<script language="JavaScript">
    window.onbeforeunload = confirmClose;
    function confirmClose() {
        return "Are you sure to close this page?";
    }
</script>

Disable browser button until page finish loading

3 Answers3

Linked