JS Tutorial – Quick search with jquery selection

Rengga Dev – The “search a list of things already on the page” idea reminds me of that classic jQuery contains selector.

$.expr[":"].CIcontains = $.expr.createPseudo(function (arg) {
  return function (elem) {
    return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
  };
});

// Every time a key is clicked
$("#filter-input").keyup(function () {
  // get the text from the box
  var curr_text = $(this).val();
  // pass it to the function
  filterResults(curr_text);
});

$("#close").click(function () {
  var curr_text = $(this).val();
  $("#filter-input").val("");
  filterResults(curr_text);
});

function filterResults(curr_text) {
  // hide all results
  $("#filter-results li").hide();
  // ... except those which are selected
  $("#filter-results li:CIcontains('" + curr_text + "')").show();
}