New Topic/Question
Reply
1. I am tasked with creating a filter to hide some common string values output in a table. The approach is to create a series of 5-8 radio buttons with defined values to hide the rows with that text in it.
Example I have a table with the following values.
"66100" "Account Details populated or changed"
"64467" "Banking information changed"
"61169" "Updated Listing Currency"
"46712" "new seller signup"
"26068" "Contact information updated."
Some of these values appear multiple times in the table so if I select the button(s) Account Details populated or changed and Contact information updated I want to have these rows filtered out of the display table.
Currently I have a function that will do this with a list, but when I tried to modify it for a table row it stops working.
Here is the code that works, it takes the string value through input and filters out the list. I'm not worried about radio buttons at this point, I just need to get the filter to work.
<!DOCTYPE html>
<html>
<head>
<title>test filtering</title>
</head>
<body>
<input name=filter>
<ul>
<li>Contact information updated</li>
<li>Banking information changed</li>
<li>Updated Listing Currency</li>
<li>new seller signup</li>
<li>Account Details populated or changed</li>
</ul>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
(function(){
var lastFilterString = '';
$('input').bind('change keydown keyup click', function(){
var $input = $(this);
var filterString = $input.val();
if (lastFilterString !== filterString) {
$('li').each(function(){
var $li = $(this);
if ($li.text().indexOf($input.val()) > -1) {
$li.show();
} else {
$li.hide();
}
});
}
lastFilterString = filterString;
});
})();
</script>
</body>
</html>
Now this works fine, however I need to have this delete a table row. My assumption was just change the values from <li> to <tr> like so and it should work. Apparently this is not the case:
<script>
(function(){
var lastFilterString = '';
$('input').bind('change keydown keyup click', function(){
var $input = $(this);
var filterString = $input.val();
if (lastFilterString !== filterString) {
$('tr').each(function(){
var $tr = $(this);
if ($tr.text().indexOf($input.val()) > -1) {
$tr.show();
} else {
$tr.hide();
}
});
}
lastFilterString = filterString;
});
})();
</script>
I am fairly new to using JQuery so the solution is not jumping out at me, I might even be doing this wrong for all I know and there might be a better solution.
MultiQuote
| 