Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery progress bar server side

I have a long running process(not definite time) in server-side(which runs number of queries in db) which takes more than 30s. I want to display the progress in % to the user. I'm using jquery ,struts in my application. Is there a way to do it?

like image 755
user1717764 Avatar asked Sep 14 '26 13:09

user1717764


1 Answers

This is how we did it.

  • When the process is triggered create a GUID from the client and pass it to the server.
  • In the server side, run the process and during the run, keep storing the progress in session/cache using the GUID as key.
  • In the client side, make ajax calls periodically to a service passing the GUID value. The service will return the progress status corresponding to the GUID value.
  • Based on the value returned from the service update the ProgressBar status.
  • If you are storing the value in session, once the process is complete make sure you clear it.

Below is a sample method to make ajax calls.

    function updateProgress() {
        if (stopProgressCheck) return;
        var webMethod = progressServiceURL + "/GetProgress";
        var parameters = "{'guid':'" + guid + "'}"; //passing the guid value

        $.ajax({
            type: "POST",
            url: webMethod,
            data: parameters,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                if (msg.d != "NONE") { //add any necessary checks
                    //add code to update progress bar status using value in msg.d
                    statusTimerID = setTimeout(updateProgress, 100); //set time interval as required
                }
            },
            error: function (x, t, m) {
                alert(m);
            }
       });    
    }

Hope this is useful to you :)

like image 83
Baga Avatar answered Sep 16 '26 03:09

Baga



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!