the html code is this one:
<body data-ng-controller="testCtrl as test">
<div class="list">
//on keyup we fire the function and do the filtering
<input id="input" type="text" data-ng-keyup="test.testFunction()" />
<ul class="parent">
<li><a href="/3">1</a></li>
<li><a href="/test">2</a></li>
<li><a href="/test">3</a></li>
<li><a href="/test">4</a></li>
<li><a href="/test">5</a></li>
<li><a href="/test">6</a></li>
<li><a href="/test">7</a></li>
<li><a href="/test">8</a></li>
<li><a href="/test">9</a></li>
<li><a href="/test">10</a></li>
</ul>
</div>
</body>
and the js:
angular.module('test', []).controller('testCtrl', ['$scope',
function($scope){
var test = this;
test.testFunction = function(){
var searchDropdown = angular.element(
document.querySelector("input") );
var filter = searchDropdown[0].value.toUpperCase();
var allListItems =
document.getElementsByClassName('parent')[0].children;
var countLists = allListItems.length;
for (var i = 0; i < countLists; i++) {
var name = allListItems[i].firstChild.innerHTML;
if (name.toUpperCase().indexOf(filter) != -1) {
allListItems[i].className= 'visible-item';
} else {
allListItems[i].className = 'hidden';
}
}
}
}]);
I've manage to do the filtering of the ul li a items with the function, but
the problem is because in the project I have multiple fields to search in
one page, the function is working only for the first field and not for the
next one.
Another problem is that because the code will be in a asp.net placeholder,
and used in different pages, with different controllers (and I use the
controller as syntax), so I could not define the same namespace in all the
different pages
I tried to do the <div class="list" data-ng-controller="filterController as
filter">
and then with all the modifications, but the problem persists, because I
would have multiple search filters in the page..
I'm sure I missing something, but I have not manage to get my head around
it.
Any idea/tips/solution is highly welcomed...
Thank you!
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
