current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Join the Stack Overflow Community
Stack Overflow is a community of 6.3 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up
up vote 0 down vote favorite

I have table that is populated from $scope and two search textboxes in header that I am using to filter user name and e-mail:

<table class="table">
<thead>
<tr>
    <th></th>
    <th><input type="search" placeholder="Search" ng-model="searchName"></th>
    <th><input type="search" placeholder="Search" ng-model="searchMail"> </th>
    <th></th>
</tr>
<tr>
    <th>ID</th>
    <th>Name</th>
    <th>email</th>
    <th>password</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="q in dataForTable | filter:{user_fullname : searchName, user_email : searchMail}">
    <td>{{q.user_id}}</td>
    <td>{{q.user_fullname}}</td>
    <td>{{q.user_email}}</td>
    <td>{{q.user_password}}</td>
</tr>
</tbody>

dataForTable comes from controller via $http :

$http.get('http://tbrzica.comli.com/rest/index.php/simple/users').success(function(data){
   $scope.dataForTable=data;
});

But when the page initially load, table is empty. Only when I write something in textboxes and delete the input, table is populated and search by both condition is working normally. Is this some kind of bug?
Thanks in advance.

EDIT: Found a solution:

I've needed to initialize two ng-model parameters inside controller:

$scope.searchName="";
$scope.searchhMail="";

tymeJV, thank you for your answers.

share|improve this question
    
Sounds like a digest cycle is never being started ($http should start one automatically). Is that $http call in your controller or a service? – tymeJV Oct 13 '13 at 18:00
    
It is called in controller – Tomislav Oct 13 '13 at 18:01
    
Put a log statement inside the success, is the log called on page load? – tymeJV Oct 13 '13 at 18:04
    
I've put console.log('I'm here') inside $http and it executes on page load. You can check it on tbrzica.comli.com. – Tomislav Oct 13 '13 at 18:07
    
Found It!! Inside controller I've to initialize two serch parameters: $scope.searchName=""; $scope.searchMail=""; – Tomislav Oct 13 '13 at 18:24
up vote 1 down vote accepted

In the controller, you can create a scope function for filter as following:

$scope.filterUser = function(fullName, email) {
    return function(user) {
        return (fullName == undefined || fullName.length == 0 || user.user_fullname == fullName)
            && (email == undefined || email.length == 0 || user.user_email == email);
    }
}

And in HTML, you can apply the filter following:

<tr ng-repeat="q in dataForTable | filter:filterUser(searchName, searchMail)">
    <td>{{q.user_id}}</td>
    <td>{{q.user_fullname}}</td>
    <td>{{q.user_email}}</td>
    <td>{{q.user_password}}</td>
</tr>

Hope this help!

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.