Jquery ile Anlık Arama/Filtreleme

Sunucu tarafında arama yapmanıza gerek kalmayacak kadar uzun listeleme yaptığınız içeriği, doğrudan Jquery ile Anlık Arama/Filtreleme yapmak için basit bir kod parçacığı yazdım. Bir script için çalışan listesini tek seferde listeliyorum, bu listede aradığımı bulmak için sunucu tarafı filtreleme yavaş kaldı. İşlemi tarayıcı tarafında yapmak için tüm listeyi tarayıcıya gönderip, arama kutusunun change olayını yakalayarak gizleme gösterme işlemi yapıyorum.

Sayfada html olarak bir arama kutusu, kaç adet içerik görüntülendiğini yazacak div, birde liste olduğunu varsayarsak;

Jquery ile search id li alana girilen değerleri containeritem sınıfına ait olan içeriklerde arayacağız. Bu containeritem elementi içerisinde başka elementler var ise onlarda da arayacak;

Oldukça basit bi yöntem. Çalışan örneğini burdan indirebilirsiniz.

Kolay gelsin.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir