I have a table which i have filtered rows based on the criteria i have specified in a dropdownlist.
After I have applied the filter i would like to do a text based search. I found some javascript code that does a search but it also searches the rows that i have filtered or hid. I just want to search the rows that were not filtered. I greatly appreciate any help with this. See the below code that i am using for the search.
<script>
$(document).ready(function(){
$("#myInput").on("keyup", function() {
var value = $(this).val().toLowerCase();
$("#myTable tr").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
});
});
});
</script>
It might be that you didn’t format the code correctly. To do this, either highlight the code and select the </> icon above the edit area, or place three backticks (`) on the line before your code, and three backticks on the line after your code. On most keyboards, you will find the backtick on the left-hand side of the top row of keys.
Thank You !!! No, I didnt find any examples. I am fairly new using javascript. If you could please offer some guidance on when you mentioned filtering decisions. Could I just include an if statement to chech if the row is hidden then don’t search on it? But I dont know exactly how to implement that into my code. Thanks for your help.
I’m not enough of a JS guru to give any solutions, sorry. Just enough to suggest angles to look for. The JS needs to be aware of the filtering changes. I don’t know how to grab those changes and implement them, sorry.
If you already have a text search, then others may have a better idea of assisting you if you give the code, such as in codepen at https://codepen.io/
You don’t need to use codepen, only that it can make things easier for those wanting to help by having everything already together in one place.
You can post enough, but not necessarily all, of your
HTML code
CSS code (if relevant)
JavaScript code
here. Others can then copy the code into files to run on their computers to test it. Not as easy for others, so some members may not bother, but if you can’t figure out how to use codepen a minimal “working page” is the next best thing to help others be able to help you.
It looks like you are not learning JS, but putting pieces of Jquery together. This might make the job harder because Jquery is doing the filtering work behind the scenes. (This is from someone who doesn’t use Jquery, so take it with a grain of salt.)
I wonder if an easier way would be to put select radio buttons for each row to designate what rows will be searched. (The dropdown will populate those radio buttons programmatically. In addition, the select buttons can be invisible.) So if the dropdown option selected is “Ford,” then only Ford cars will be selected, and those rows will have the radio button selected.
Then when the search is begun, the JS will only search the rows having radio buttons selected. In this way the JS has a handle on exactly what to search. The script has to know what rows have been selected, and this is one way to do it.
