SO - 30068786

by Arun P Johny

HTML

<div class="box col-md-12 items tags">
    <ul>
        <li class="head">Producent</li>
        <li>
            <input id="producent1" type="checkbox" class="szukajnapraw Promise" rel="Promise" />Promise</li>
        <li>
            <input id="producent2" type="checkbox" class="szukajnapraw NetStor" rel="NetStor" />NetStor</li>
        <li>
            <input id="producent3" type="checkbox" class="szukajnapraw Stardom" rel="Stardom" />Stardom</li>
        <li>
            <input id="producent4" type="checkbox" class="szukajnapraw LaCie" rel="LaCie" />LaCie</li>
        <li>
            <input id="producent5" type="checkbox" class="szukajnapraw G-Tech" rel="G-Tech" />G-Tech</li>
        <li>
            <input id="producent6" type="checkbox" class="szukajnapraw mLogic" rel="mLogic" />mLogic</li>
        <li>
            <input id="producent7" type="checkbox" class="szukajnapraw Tiger Technology" rel="Tiger Technology" />Tiger Technology</li>
    </ul>
</div>
<table class="table table-striped table-bordered">
    <thead>
        <tr>
            <th>Producent</th>
            <th>Produkt</th>
            <th>Foto</th>
            <th>Typ</th>
            <th>Cena netto</th>
            <th>Cena brutto</th>
            <th>Interface</th>
            <th>Ilość dysków</th>
            <th>Pojemność</th>
            <th>RAID</th>
            <th>Wydajność</th>
            <th>Opis</th>
            <th>Specyfikacja</th>
            <th>Zakup</th>
        </tr>
    </thead>
    <tbody class="results">
        <tr data-producent="Tiger Technology">
            <td>Tiger Technology</td>
            <td>Macierz 123 TEST</td>
            <td>
                <img src="admin/forms/temp/ff.jpg" style="width:50px;height:50px;">
            </td>
            <td>NAS Network Attached Storage</td>
            <td>69.00</td>
            <td>124.00</td>
            <td>Thunderbolt2</td>
            <td>60</td>
            <td>5tb</td>
            <td>0 1</td>
           ...

JavaScript

$(document).ready(function () {
    $('.results > tr').hide();

    $('div.tags').find('input:checkbox').on('click', function () {
        $('.results > tr').hide();
        $('div.tags').find('input:checked').each(function () {
            $('.results > tr[data-producent="' + $(this).attr('rel') + '"]').show();
        });
    });
});