Hello everyone, this is my initial post on StackOverflow. Keeping my fingers crossed that it goes smoothly!
<input type="Text" id="filterTextBox" placeholder="Filter by name"/>
<script type="text/javascript" src="/resources/events.js"></script>
<script>
$("#filterTextBox").on("keyup", function () {
var search = this.value;
$(".kurssikurssi").show().filter(function () {
return $(".course", this).text().indexOf(search) < 0;
}).hide();
});
</script>
I have integrated a JavaScript snippet similar to this in my school project, you can check it out here:
The search bar at the bottom of the page is designed to filter divs and only display those containing a specific keyword. For instance, if you enter "Digital Electronics," it will only show divs with text "Digital Electronics II" and "Digital Electronics." Currently, when I input random characters, everything hides as expected. However, if I start typing the beginning of a course name, it fails to hide courses that do not match the text string.
I have included an example that I found useful (link): http://jsfiddle.net/Da4mX/
It's a bit tricky to explain, but I hope you'll understand once you try using the search functionality on my site. As a beginner in JavaScript, I grasp setting the searchbox string as 'var search,' but the other details are fuzzy for me.
I would greatly appreciate any assistance in dissecting the script, identifying where I might be making mistakes, and suggesting how to resolve the issue.