0

This is my HTML form div

<div class="col-lg-2 ">                                              
    <select name="limitCount" id="limitCount" ng-model="limitCount"  
        class="form-control col-md-2 panel-refresh"              
        ng-change="filterChanged()">                             
        <option value=0>All Records</option>                         
        <option value="1">1 Record</option>                          
        <option value=5 selected>5 Records</option>                  
        <option value=10>10 Records</option>                         
        <option value=25>25 Records</option>                         
        <option value=50 selected>50 Records</option>                
        <option value=100 selected>100 Records</option>              
        <option value=200 selected>200 Records</option>              
        <option value=300 selected>300 Records</option>              
        <option value=500 selected>500 Records</option>              
        <option value=1000 selected>1000 Records</option>            
    </select>                                                        
</div>

and this is my controller for this div

$scope.filterChanged = function () {
    controller.resetGraph = true;
    loadGraphData();
};

Now I want that , when I ever I am selecting from selection dropdown it should show some spinner in the ui(like some loader) until data is fetched from mongodb. please help me as fast as you can . I have to complete this work.write now I am using this, but it is not working at all

$scope.$on('panel-refresh', function (event, id) {
    spinnerId = id;
    $scope.find();
});
Monasha
  • 711
  • 2
  • 16
  • 27
  • http://stackoverflow.com/questions/15033195/showing-spinner-gif-during-http-request-in-angular check out this will show u how to handle spinner – Sa E Chowdary Nov 07 '16 at 05:53

1 Answers1

0

You have typo in this near controller.resetGraph = true;$s , like what is $s ?

Here i am going to show you like how you can allow spinner to show and hide after data loaded.

<div class="col-lg-2 ">   
<div ng-show="loading" > <img scr="" alt="" /> </div>                                           
<select name="limitCount" id="limitCount" ng-model="limitCount"  
        class="form-control col-md-2 panel-refresh"              
        ng-change="filterChanged()">                             
    <option value=0>All Records</option>                         
    <option value="1">1 Record</option>                          
    <option value=5 selected>5 Records</option>                  
    <option value=10>10 Records</option>                         
    <option value=25>25 Records</option>                         
    <option value=50 selected>50 Records</option>                
    <option value=100 selected>100 Records</option>              
    <option value=200 selected>200 Records</option>              
    <option value=300 selected>300 Records</option>              
    <option value=500 selected>500 Records</option>              
    <option value=1000 selected>1000 Records</option>            
</select>
</div>

Now in your controller define one variable like : 

$scope.loading = false // Initially false to hide spinner

Now when data filter or something you need to just assign Boolean true like this :

$Scope.filterChanged = function () {
    $scope.loading = true// Allow spinner to load
    controller.resetGraph = true;$s
    loadGraphData().then(function(){
    $scope.loading = false// Allow spinner to stop load on finish data lading
     });
};

Let me know if you are not able to get this.

Jigar7521
  • 1,549
  • 14
  • 27
  • $s is by mistake, and i dont want any pic for showing loader, is it not possible to show some some dynamic loader like using $scope.$on. –  Nov 07 '16 at 06:23
  • yes you can even use css for that, and yes you can show some dynamic loader like to make one function, you will need to just call it. Let me to update my answer if you want. Let me know first. – Jigar7521 Nov 07 '16 at 06:26
  • yes i want dynamic controller. let me send the loader type
    Ball Zig Zag
     –  Nov 07 '16 at 06:31