php / ajax ...

3 Cevap php

Dürüst olmak gerekirse, ben bu konuda gitmek için en iyi yolu bile emin değilim, ama aslında, ben bir $ tür parametresi alır ve sonra geçti $ türüne göre benim db / yazdırma sonuçlarını alacağınız bir içerme dosyası bir işlevi var bu ... Ne yapmaya çalışıyorum belli bir linke tıkladığınızda, işlevi çalıştırmak ve buna göre sonuçlarını gösterecektir, bu sayfadaki bağlantıların bir dizi var olduğunu ...

Yani, sayfanın ilk yük, her şeyi görüntüleyen bir tablo var (ve büyük ölçüde tabloyu basitleştirilmesi ediyorum ...)

<table>
<tr><th>Item</th><th>Type</th></tr>
<tr><td>Milk</td><td>Dairy</td></tr>
<tr><td>Yogurt</td><td>Dairy</td></tr>
<tr><td>Chicken</td><td>Meat</td></tr>
<tr><td>Zucchini</td><td>Vegetable</td></tr>
<tr><td>Cucumber</td><td>Vegetable</td></tr>
</table>

Ve sonra, bir kenar çubuğunuzda, ben bağlantıları bir dizi var:

<a href="#">Dairy</a>
<a href="#">Meat</a>
<a href="#">Vegetable</a>

Kullanıcı "Sebze" tıklarsa, benim dosya içerir gelen işlev göstermek için tabloda çalıştırın ve filtre böylece ben (ve ileri geri, vb) tıklandığında bağlantıya dayanan, ilk tablosunu filtrelemek istiyorum "Sebze" türleri yalnızca ...

3 Cevap

Akla gelen ilk fikir bir sınıf özniteliği eklemek için Ra için etiketleri ve kimliği öznitelikler etiketleri kolayca bu şekilde filtre böylece:

<tr class="dairy"><td>Milk</td><td>Dairy</td></tr>
<tr class="meat"><td>Chicken</td><td>Meat</td></tr>

<a href="#" id="dairy">Dairy</a>
<a href="#" id="meat">Meat</a>

Sonra JavaScript (Ben burada jQuery kullanıyorum):

$('a').click(function(evt){
    var myId = $(this).attr('id');

    $('tr').each(function(idx, el){
        if ($(el).hasClass(myId))
        {
            $(el).show();
        }
        else
        {
            $(el).hide();
        }
    });
});

Bu kodunuzu değiştirmek zorunda kalmadan metni yerelleştirilmesine izin yararı vardır.

Tamam ben uygun bir cevap oluşturdu. Bunu Darrel bunu önerdi şekilde yapabilirsiniz. Bu tanımlama önlemek için çağrı şey için sadece bir uzantısıdır:

$('a').click(function(evt){
    var myId = $(this).attr('id');


    // append a idndicator to the current url
    var location = "" + document.location + "";
    location = location.split('#',1);
    document.location = location + '#' + $(this).attr('id');


    //append to next and previous links
    $('#nextlink').attr({
        'href': $('#nextlink').attr('href') + '#' + $(this).attr('id')
    });
    $('#previouslink').attr({
        'href': $('#previouslink').attr('href') + '#' + $(this).attr('id')
    });

    $('tr').each(function(idx, el){
        if ($(el).hasClass(myId))
        {
            $(el).show();
        }
        else
        {
            $(el).hide();
        }
    });
});

Sayfa yük sonra yürütülür bazı kod:

var filter = window.location.hash ? '[id=' + window.location.hash.substring(1, window.location.hash.length) + ']' : false;
if(filter)
    $('a').filter(filter).click();

Bu / özel kimliği ile linke sayfa yük bir tıklama yürütür simüle.

Büyük bir veritabanı varsa, ama genel olarak, size backend SQL ile doğrudan filtre gerekir. Bu görüntülenen tabloda daha tutarlı olur. Örneğin sayfa 1 sadece 3 sınıf 'süt' satır ve sınıf 'süt' 2. sayfasında 10 üzerinde olabilir eğer.

Sen ön bütün tabel yazdırarak eğer geri basit gizlemek belirli bir türde tüm teh satırları can sunucusuna gitmeye gerek yoktur. JQuery ile örneğin:

    $('#sidebar a').click(function(){
      // grab the text content of the a tag conver to lowercase
      var type = $(this).text().toLowerCase();

      /* filter all the td's in the table looking for our specified type then hid the 
       * row that they are in
       */
      $('#my_data_table td').contents().filter(function(){
         return this.nodeType == 3 && this.toLowerCase() == type;
      }).parent('tr').hide();

      return false;
    });

İçerik sen nedense (bu konuda yardımcı olmak için tüm alt durumda dolayısıyla benim dönüşüm) için beklemiyordum varsa metin içeriği filtreleme zor alabilirsiniz çünkü TR bir sınıf ekleyerek abotu öneri iyidir gerçekten olsa.