search filter javascript code example

Example 1: search in a table jquery

<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>

Example 2: .filter js

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

Example 3: search functionality for html table

BY LOVE SINGH,
Call this function onKeyUp event of TEXTBOX.

function myFunction() {
            var input, filter, table, tr, td, i;
            input = document.getElementById("TextBoxID");
            filter = input.value.toUpperCase();
            table = document.getElementById("TableID");
            tr = table.getElementsByTagName("tr");
            for (i = 0; i < tr.length; i++) {
                td = tr[i].getElementsByTagName("td")[1];
                var x = $("#TextBoxID").val();
                var regex = /^[a-zA-Z]+$/;
                if (!x.match(regex)) {
                    td = tr[i].getElementsByTagName("td")[0];
                }
                if (td) {
                    if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
                        tr[i].style.display = "";
                    } else {
                        tr[i].style.display = "none";
                    }
                }
            }
        }

Example 4: js filter text

<script>
    $('input[name="search_field"]').on("keyup", function() {
        filtrate($(this).val().toLowerCase());
    });

    function filtrate(searched) {
        $(".filter-key > h3").filter(function() {
            var isHidden = ($(this).text().toLowerCase().indexOf(searched) > -1) ? 'block' : 'none';
            $('.filter-key').css('display', isHidden);
        });
    }
</script>

Tags:

Html Example