Delay in selecting a row

Delay in selecting a row

rf1234rf1234 Posts: 2,991Questions: 87Answers: 421

Is there a way to show a "please wait while your data are being retrieved" message to the user when she clicks on a row to select it and the select takes long because a couple of tables are being drawn in the background?

My problem is that in browsers other than Chrome nothing seems to happen when the user clicks on a row and only after all the work has been completed the row is highlighted as selected. This may lead to confusion on the user side. (In Chrome I simply put most of the tasks triggered by the "on select" event listener into a timeout which makes the row selected immediately. In Firefox and Edge this doesn't work. The row only appears to be selected after all the work has been completed.)

Answers

  • rf1234rf1234 Posts: 2,991Questions: 87Answers: 421
    edited February 2018

    https://github.com/piccard21/busy-load

    works perfectly with a nice font awesome spinner.

    do this "on select":

    // show
    $.busyLoadFull("show", { 
       fontawesome: "fa fa-refresh fa-spin fa-3x fa-fw"
    });
    

    and this "on draw" of the last child table:

     // hide
    $.busyLoadFull("hide", { 
       // options here 
    });
    

    The above is immediately executed "on select". I put all the remaining tasks "on select" into a 100 milliseconds timeout. Otherwise firefox doesn't get it. For chrome 5 milliseconds were enough though.

This discussion has been closed.