locked
how to stop Indeterminate Progress Bar on data load.

    Question

  • I am using Indeterminate Progress Bar, when i am navigating from one page to another.

    On my next page i am getting async data which takes sometime to load, in the meanwhile i am using progress bar. But the problem is the progress bar never stops, the data is displayed and the progress bar continues to move. 

    i just want to stop the progress bad on loading my data. i am showing the data in a listview. 

    <progress class="win-large"></progress>


    deepanshu jaiswal monocept

    Wednesday, December 19, 2012 2:33 PM

Answers

  • Add an id="loadingIndicator" to your progress bar, then try calling this code when your data is done loading:

     var loadingIndicator= document.getElementById("loadingIndicator");
            if (loadingIndicator) {
                loadingIndicator.style.display = "none";
            }


    Dave Paquette @Dave_Paquette www.davepaquette.com

    • Marked as answer by roadie1000 Monday, December 24, 2012 8:24 AM
    Wednesday, December 19, 2012 3:20 PM
  • You could hide the progress bar via Javascript once the data has been loaded. A stopped indeterminate progress bar might show kind of strange with the dots frozen in place.

    Assign an "id" to the progress tag and on your Javascript, once the data is loaded just do: documento.getElementById("id_assigned").style.display='none';

    or

    documento.getElementById("id_assigned").style.visibility='hidden';

    The difference is that the second once will hide the progress bar but the control will keep occupying the same space in your layout. The first one will hide the bar and the layout will act as it never existed and might affect some other control positions (depending your layout).

    • Marked as answer by roadie1000 Wednesday, January 2, 2013 8:04 AM
    Wednesday, December 19, 2012 3:23 PM

All replies

  • Add an id="loadingIndicator" to your progress bar, then try calling this code when your data is done loading:

     var loadingIndicator= document.getElementById("loadingIndicator");
            if (loadingIndicator) {
                loadingIndicator.style.display = "none";
            }


    Dave Paquette @Dave_Paquette www.davepaquette.com

    • Marked as answer by roadie1000 Monday, December 24, 2012 8:24 AM
    Wednesday, December 19, 2012 3:20 PM
  • You could hide the progress bar via Javascript once the data has been loaded. A stopped indeterminate progress bar might show kind of strange with the dots frozen in place.

    Assign an "id" to the progress tag and on your Javascript, once the data is loaded just do: documento.getElementById("id_assigned").style.display='none';

    or

    documento.getElementById("id_assigned").style.visibility='hidden';

    The difference is that the second once will hide the progress bar but the control will keep occupying the same space in your layout. The first one will hide the bar and the layout will act as it never existed and might affect some other control positions (depending your layout).

    • Marked as answer by roadie1000 Wednesday, January 2, 2013 8:04 AM
    Wednesday, December 19, 2012 3:23 PM
  • Thanks a lot Dave now its working properly.

    It was simple.

    Hope you will help solving my other simple issues.


    deepanshu jaiswal monocept


    • Edited by roadie1000 Friday, December 21, 2012 8:08 AM
    Thursday, December 20, 2012 7:37 AM