Smart table reset / refresh on input field search does not load the original data

467 Views Asked by At

When refreshing the table data with search input field, it displays table data with the last search input field value.

How can I remove the filter on the click of the refresh/clear button and get the original data?

Please find the page view GUI

 $scope.Refresh = function () {
        $scope.searchall="";     
        $scope.DataLoad();      
    };
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.6/angular.min.js"></script>
<button type="button" class="btn-sm btn-default" ng-click="Refresh()">Refresh</button>
<div>
   <select autocomplete="off" style="width: 60px;" ng-model="CountPerPage"
   ng- options="x for x in CountPerPageOptionValues">
   <option value="">All</option>
   </select>
</div>
<table ng-show="DataLoaded" st-table="Collection" class="table table-striped animate-show" st-safe-src="data" >
    <thead>
        <tr>
            <th st-sort="Id">ID</th>
            <th st-sort="Name">Name</th>
            <th st-sort="Timestamp" style="min-width:68px;">Timestamp</th>
            <th st-sort="Message" style="min-width:136px;">Message</th>
        </tr>
         <tr>
             <th>
                <input ng-model="searchall" ng-show="!nomsg" st-search="Name" placeholder="search for Name" class="input-sm form-control" style="width:140px" type="search" />
             </th>
         </tr>
      </thead>
  <tbody data-ng-hide="isLoading" data-ng-animate="'fade'">
                                        *emphasized text*<tr ng-repeat="latestData in Collection">
                                            <td>{{latestData .Id}}</td>
                                            <td>{{latestData .Name}}</td>
                                            <td>{{latestData .Timestamp | date:'dd MMM yyyy hh:mm:ss a'}}</td>
                                            <td>
                                                {{latestData.Message}}
                                            </td>
                                        </tr>
                                    </tbody>
                                    <tfoot>
                                        <tr>
                                            <td colspan="5" class="text-center">
                                                <div st-pagination="" st-items-by-page="CountPerPage" st-displayed-pages="7"></div>
                                            </td>
                                        </tr>
                                    </tfoot>
                                </table>

0

There are 0 best solutions below