Android : element not hidden in a keyup event on mobile

on Thursday, August 21, 2014


I have a keyup event which gets the value from an input and checks it against a list of items. The items that do not match, will be hidden.



$(".search-cust").on('keyup',function(e) {
e.preventDefault();
var value = $(this).val().toLowerCase();

if( value.length == 0 ) {
$('#station-list li').each(function() {
$(this).show();
});
return false;
}

$('#station-list li').each(function() {
var name = $(this).find('.name').text().toLowerCase();
var comp = $(this).find('.company').text().toLowerCase();
var mobi = $(this).find('.mobile').text().toLowerCase();
var cust = $(this).find('.customernumber').text().toLowerCase();

if(name.match( value )) {
$(this).show();
} else if(mobi.match( value )) {
$(this).show();
} else if(cust.match( value )) {
$(this).show();
} else if(comp.match(value)) {
$(this).show();
} else {
$(this).hide();
}
});
});


This works perfectly on desktop but on mobile (in my testcase Samsung Galaxy S2), the element is not being hidden. The event itself works and I did some alerts and saw that it reaches the else statement but is not hiding the element.


0 comments:

Post a Comment