I have a project where on change of select box I am loading data from the server. How do I make sure that until the data is loaded user can't do anything else on the page?
Add a comment
|
3 Answers
You can create a modal dialog using jQuery UI or some other JavaScript library.
On the close event of the plugin you can check whether data has been received using global variable is_received. If is_received == true then let closeevent close the modal dialog by returning true else return false. I am assuming that close event stops the user from closing the modal dialog if you return false. Also you can show user friendly message inside of the modal dialog telling user that data is being loaded.
Another way could be: you disable close buttons of the modal dialog and upon receiving data from the server enable those buttons again. The modal diaog will stop the user from interacting with contents.
3 Comments
Dan Heberden
lol - that "answer has been posted" message needs to be a bit quicker
Ayaz Alavi
yeah a minute earlier. I think that can be only possible solution on html web pages unless you disable all input elements on webpage or hide body contents for a while
Ayaz Alavi
you can use code from this page jquery.malsup.com/block/#dialog . It is exactly what you want.
From a UI perspective, loading a modal window is your best option. with jQuery, you can use jQueryui - launch a modal dialog that has a "working" or similar message to prevent user interaction.
3 Comments
Hacker
i dont wanna use modal. until the data is loaded from server . it should show text as loading... and block the user interaction..how do i do it...
Dan Heberden
for everything or just a particular element? and if element, what kind?
Hacker
i tried it..i had googled that .. dono what was wrong. it loaded an youtube video in ma website..plugin had that video code ...
