html - How to filter and Search a table with ngFilter? -


i have seen many examples , tutorials table search , tried work. issue search table results seen in current page. mean is, have used pagination , search filer works in page visible user. doesn't results in other paginated pages.

i have implemented simple search, explained in every example. why approach behave this? appreciated.

here's table.html

<div class="row">    <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">        <div class="input-group input-icon">            <input id="empid" ng-model="search.empid" type="text" class="form-control" name="empid" placeholder="search id">            <span class="input-group-addon">                <i class="fa fa-search s14"></i>            </span>        </div>    </div>    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">        <div class="input-group input-icon">            <input id="ename" ng-model="search.fname" type="text" class="form-control" name="ename" placeholder="search name">            <span class="input-group-addon">                <i class="fa fa-search s14"></i>            </span>        </div>    </div> </div> <div class="row">                                       <div class="col-md-6 col-xs-12">     view <label>            <span>             <select class="form-control input-sm" ng-model="viewby" ng-options="x x in nums" ng-change="setemployeesperpage(viewby)"></select>                                                                         </span>        </label> records @ time.    </div>                              <table id="basic-datatables" class="table table-bordered table-hover" cellspacing="0" width="100">    <thead style="text-align:match-parent">        <tr>            <th rowspan="1" colspan="1" style="width:100px">                <a href="javascript:void(0)" class="table-links" ng-click="sorttype='empid'; sortreverse=!sortreverse">                    <span ng-show="sorttype != 'empid'" class="fa fa-unsorted"></span>                    <span ng-show="sorttype == 'empid' && !sortreverse" class="fa fa-sort-asc"></span>                    <span ng-show="sorttype == 'empid' && sortreverse" class="fa fa-sort-desc"></span>                 id</a>            </th>            <th rowspan="1" colspan="1" style="width:200px">                <a href="javascript:void(0)" class="table-links" ng-click="sorttype='fname'; sortreverse=!sortreverse">                    <span ng-show="sorttype != 'fname'" class="fa fa-unsorted"></span>                    <span ng-show="sorttype == 'fname' && !sortreverse" class="fa fa-sort-asc"></span>                    <span ng-show="sorttype == 'fname' && sortreverse" class="fa fa-sort-desc"></span>                first name</a>            </th>            <th rowspan="1" colspan="1" style="width:200px">                <a href="javascript:void(0)" class="table-links" ng-click="sorttype='lname'; sortreverse=!sortreverse">                    <span ng-show="sorttype != 'lname'" class="fa fa-unsorted"></span>                    <span ng-show="sorttype == 'lname'&& !sortreverse" class="fa fa-sort-asc"></span>                    <span ng-show="sorttype == 'lname'&& sortreverse" class="fa fa-sort-desc"></span>                last name</a>            </th>            <th rowspan="1" colspan="1" style="width:200px">email</th>            <th rowspan="1" colspan="1" style="width:100px">mobile</th>            <th rowspan="1" colspan="1" style="width:200px">designation</th>            <th rowspan="1" colspan="1" style="width:200px">dept. name</th>        </tr>    </thead>    <tbody>        <tr ng-click="selectrow(emp)" ng-repeat="emp in employeedetails.slice(((currentpage-1)*itemsperpage),((currentpage)*itemsperpage)) | filter:search | orderby:sorttype:sortreverse" style="text-align:match-parent">            <td>{{emp.empid}}</td>            <td>{{emp.fname}}</td>            <td>{{emp.lname}}</td>            <td>{{emp.email}}</td>            <td>{{emp.mobile_no}}</td>            <td>{{emp.designation}}</td>            <td>{{emp.department_name}}</td>        </tr>    </tbody> </table>  <div class="row">    <div class="col-md-8 col-xs-12">        <uib-pagination total-items="totalemployees" ng-model="currentpage" ng-change="pagechanged()" max-size="maxsize" boundary-links="true" class="pagination" items-per-page="itemsperpage"></uib-pagination>    </div> </div> 

here's controller.js

this how json.

(function initcontroller() {      employeeservice.getempdetails(function (res) {         $scope.employeedetails = json.parse(res.data);     }); })(); 

how can implement it. thanks

ng-repeat="emp in employeedetails      | filter:search      | limitto: itemsperpage : (currentpage-1)*itemsperpage      | orderby:sorttype:sortreverse" 

try this.. first filter limit.


Comments

Popular posts from this blog

amazon web services - S3 Pre-signed POST validate file type? -

c# - Check Keyboard Input Winforms -