CODEWITHSUNDEEP
angularjssearchngtable
byteC0de
byteC0de

Reputation: 5273

Single text box search in ng-table

I am using ng-table for users listing in my app.

enter image description here

This is my table, I can single field a time. But I want to search multiple keys with single field

I have a array of values var search = ['Suhail', 'User']; I want to search this array in data

Eg:- Suhail,User Like

function getUsers(params) {
        var data = { page: params.page(), count: params.count() };
        if (!users.length) {
            var getUsersCallBack = userService.getUsers(data);
            return getUsersCallBack.then(function (response) {
                var responseJson = angular.fromJson(response.data);
                vm.out = responseJson.data;
                users = vm.out.invitations.concat(vm.out.users);
                users.forEach(function (user, index) {
                    user.statusName = status[user.status];
                    user.invitation = (index < vm.out.invitations.length) ? "Pending" : "Accepted";
                    user.roleName = vm.userRoles[user.role];
                }, this);
                vm.tableBasic.total(users.length);
                var orderedData = vm.search ? $filter('filter')(users, vm.search) : users;
                vm.resultNotFound = orderedData.length ? false : true;
                return (orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
            });
        }
        else {
            var searchArr = vm.search.$.split(";");
            var orderedData = vm.search ? $filter('filter')(users, vm.search) : users;
            vm.resultNotFound = orderedData.length ? false : true;
            vm.tableBasic.total(orderedData.length);
            return (orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
        }

    }

    vm.tableBasic = new NgTableParams({
        page: 1,
        count: 5
    }, {
            counts: [],
            filterDelay: 300,
            getData: getUsers
        });

Upvotes: 0

Views: 864

Answers (1)

ashishkumar148
ashishkumar148

Reputation: 1005

Just use in-build $filter of angular. You have object with all table data. Apply angular filter on that variable and then show the response in table.

$scope.loadTable = function(){
        $scope.data = $scope.searchText ? $filter('filter')($scope.table_data, $scope.searchText) : $scope.table_data;
        $scope.tableParams = new NgTableParams({},{dataset: $scope.data});
    }

    $scope.clearSearch = function(){
        $scope.searchText = '';
        $scope.loadTable();
    }

Here loadTable function is called on submitting Search button and clearTable function is called on clearing the filter and reloading the table data.

Upvotes: 1

Related Questions