Quantcast
Channel: Active questions tagged javascript - Stack Overflow
Viewing all articles
Browse latest Browse all 138192

Remove current filter

$
0
0

I have a list of items wrapped in div that can either be filtered using drop down or input box. How do you remove the filter from input box before filtering using the drop down? It only affect when filtered via input first then drop-down. It works the other way around.

I have an input box that filters the div with the following:

$("#dirSearchKey").on("keyup", function() {
var value = $(this).val().toLowerCase();
$("#searchBlock div[class^=filterDiv]").each(function() {
    $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
});
});

The filter is cleared when user manually deletes the input box value. I found out I can't trigger a delete or backspace key. I tried removing the last character as suggested on this post but it didn't work.

I'm using below code from w3school to filter the elements via a drop down.

function filterSelection(c, d) {
var x, i;
    x = document.getElementsByClassName("filterDiv");

if (c == "all") c = "";
for (i = 0; i < x.length; i++) {
    w3RemoveClass(x[i], "show");
    if (x[i].className.indexOf(c) > -1) w3AddClass(x[i], "show");
}
document.getElementById('formheader').innerHTML = d + ' Form(s)';
}

function w3AddClass(element, name) {
var i, arr1, arr2;
    arr1 = element.className.split("");
    arr2 = name.split("");
for (i = 0; i < arr2.length; i++) {
    if (arr1.indexOf(arr2[i]) == -1) {element.className += "" + arr2[i];}
}
}

function w3RemoveClass(element, name) {
var i, arr1, arr2;
    arr1 = element.className.split("");
    arr2 = name.split("");
for (i = 0; i < arr2.length; i++) {
    while (arr1.indexOf(arr2[i]) > -1) {
        arr1.splice(arr1.indexOf(arr2[i]), 1);     
    }
}
element.className = arr1.join("");
}

I added below in filterSelection() but it seems to only work once. Subsequent filters between drop-down and input don't work.

        var srcVal = document.getElementById('dirSearchKey').value;
    if (srcVal !== '') {
        document.getElementById('dirSearchKey').value = '';
        $("#searchBlock div[class^=filterDiv]").filter(function() {
            var value = '';
            $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
        });
    }

Viewing all articles
Browse latest Browse all 138192

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>