Translate Blog

16 Temmuz 2014 Çarşamba

Jquery ile Basit Filtreleme Yapmak / Make a Simple Filter With Jquery Filter

[Sayfanızda Jquery yüklemeyi unutmayın.]

Sayfanızdaki aşağıdaki gibi içinde data-type tagı barındıran <li> ler bulunsun, data-type değerinin oku kelimesi olduğunu görüyorsunuz.

<li data-type='oku'>
          <img src="kelimeislemci/kelimeler/okumak_2.jpg">
</li>

Aşağıdaki scripti sayfada çalıştırırsanız sayfanızdaki diğer <li> tagları display özellikleri none'a eşitlenecek yani gizlenecektir.

<script>
$(function () {
var sonuc = $('ul').find('li[data-type!=oku]');
sonuc.css('display','none');
});
</script>


You can use <li data-type="word"> to filter objects on the page. you can use other tags too, I just use this.
If you want to search/filter a word,  use above script. This script make your list hide, except <li> that has data-type=word

<li data-type='word'> word - 1 </li>
<li data-type='book'> word - 2 </li>
<li data-type='school'> word - 3 </li>
<script>
$(function () {
var sonuc = $('ul').find('li[data-type!=word]');
sonuc.css('display','none');
});
</script>

Above code only display word-1, others will be hidden.