filter on angularJs multiselect is not working -


i have user related information, comes api showing in table:-

<button ng-click="fetchdetails()">fetch</button>  <table>      <thead>        <tr>           <th>user code</th>           <th>occupation</th>           <th>first name</th>           <th>last name</th>           <th>access name</th>           <th>pan no</th>           <th>father/spouse name</th>           <th>date of birth</th>           <th>email id</th>           <th>landline</th>           <th>mobile</th>           <th>pin code</th>        </tr>      </thead>      <tbody>         <tr ng-repeat="row in data |namefilter:selectname track $index">            <td>{{row.usercode}}</td>            <td>{{row.occup}}</td>            <td>{{row.frstname}}</td>            <td>{{row.lstname}}</td>            <td>{{map.names[row.accesscode]}}</td>            <td>{{row.pan}}</td>            <td>{{row.fthrorspsename}}</td>            <td>{{row.doborinc}}</td>            <td>{{row.emailid}}</td>            <td>{{row.landline}}</td>            <td>{{row.mobile}}</td>            <td>{{row.pincode}}</td>        </tr>      </tbody> </table>   <label>filter:</label>  <label>access name:</label>        <div ng-model="selectedvalue" ng-dropdown-multiselect="" options="multiselectarray" selected-model="selectname" extra-settings="multiselectsettings"></div> 

in directive:-

(function () {     'use strict';     angular.module('myapp.components')     .filter('namefilter', function(){         return function (input, value) {           return input.filter( function( el ) {             return value.indexof( el.name ) >= 0;          });         }      })         .directive('main', main);      main.$inject = ['$http','apiservices'];      function main($http, apiservices) {         return {             restrict: 'ea',             scope: {},             controller: function($scope){                 $scope.selectname = [];                 $scope.multiselectarray = [                     {name: 'sophia'},                     {name: 'jackson'},                     {name: 'emma'},                     {name: 'aiden'},                     {name: 'olivia'},                     {name: 'lucas'},                     {name: 'ava'},                     {name: 'liam'},                     {name: 'mia'},                     {name: 'noah'}                     ];                  $scope.multiselectsettings = {                     smartbuttonmaxitems:4,                     scrollable: true,                     displayprop: "name",                     idprop: "name",                     externalidprop: "name"                 };              },             link: function (scope, el, attrs) {                  scope.map = {};                  scope.map.names = ['sophia','jackson','emma','aiden','olivia','lucas','ava','liam','mia','noah'];                    scope.fetchdetails = function () {                     apiservices.fetchdetails().then(                         function (response) {                             scope.data = response.data;                         });                  };             },             templateurl: 'js/components/main.html'         };     }  })(); 

my sample response:-

[{"usercode":"12345","frstname":"marry","lastname":"joseph","accesscode":3,"pan":null,"occup":"student","fthrorspsename":"ryan joseph","doborinc":"12-07-1987","emailid":"marry@gmail.com","landline":null,"mobile":null,"pincode":null}] 

i mapping access code access name , showing in table. have filter allows multiple select , based on selected values want filtering table. have custom filter functionality. but, after pressing fetch button data not appearing in table after removing filter. also, not sure if filter working. can tell me wrong in code.


Comments

Popular posts from this blog

php - Vagrant up error - Uncaught Reflection Exception: Class DOMDocument does not exist -

vue.js - Create hooks for automated testing -

Add new key value to json node in java -