2016-05-08 2 views
2

Пожалуйста, взгляните на следующий jsfiddle.По умолчанию для фильтра javascript/jQuery скрываются все строки таблицы

https://jsfiddle.net/51Le6o06/42/

Как вы можете видеть фильтр таблицы («.filter-подарок») населяет себя данные из HTML таблицы ниже него. Я спрятал все остальные скрипты, чтобы это стало проще видеть.

Проблема заключается в том, что я правильно выбрал фильтр, например «Free TV», соответствующие фильтры таблицы, но если я затем выберем параметр фильтра по умолчанию в таблице, фильтр скрывает все строки.

Идеальный выбор параметра по умолчанию «-Выбрать-» должен отображать все строки, как я могу изменить свой код, так что это имеет место с моей функцией.

JQuery/JavaScript используется:

$(document).ready(function() { 
    $('.filter-gift').each(filterItems); 
}); 

function filterItems(e) { 
    var items = []; 
    var table = ''; 
    tableId = $(this).parent().parent().attr('tag') 

     var listItems = ""; 
     listItems += "<option value='0'> -Select- </option>"; 
     $('div[tag="' + tableId + '"] table.internalActivities .information').each(function (i) { 
      var itm = $(this)[0].innerText; 
      if ($.inArray(itm, items) == -1) { 
       items.push($(this)[0].innerText); 
       listItems += "<option value='" + i + "'>" + $(this)[0].innerText + "</option>"; 
      } 
     }); 

    $('div[tag="' + tableId+ '"] .filter-gift').html(listItems); 

    $('.filter-gift').change(function() { 
     var tableIdC = $(this).parent().parent().attr('tag'); 

     var text = $('div[tag="' + tableIdC + '"] select option:selected')[0].text.replace(/(\r\n|\n|\r| |)/gm, "");; 
      $('div[tag="' + tableIdC + '"] .product-information-row').each(function (i) { 
       if ($(this).text().replace(/(\r\n|\n|\r| |)/gm, "") == text) { 
        $(this).show(); 
        $(this).prev().show(); 
        $(this).next().show(); 
       } 
       else { 
        $(this).hide(); 
        $(this).prev().hide(); 
        $(this).next().hide(); 
       } 
      });   
     });  
} 

ответ

1

установленное значение для 999> использовать, если (! $ (Это) .val() = 999) еще заявление, как показано ниже

$('.filter-gift').change(function() { 
    if($(this).val()!= 999) { 
     var tableIdC = $(this).parent().parent().attr('tag'); 

     var text = $('div[tag="' + tableIdC + '"] select option:selected')[0].text.replace(/(\r\n|\n|\r| |)/gm, "");; 
      $('div[tag="' + tableIdC + '"] .product-information-row').each(function (i) { 
       if ($(this).text().replace(/(\r\n|\n|\r| |)/gm, "") == text) { 
        $(this).show(); 
        $(this).prev().show(); 
        $(this).next().show(); 
       } 
       else { 
        $(this).hide(); 
        $(this).prev().hide(); 
        $(this).next().hide(); 
       } 
      }); 
      } else { 
      $(this).parent().parent().find('table tr').show(); 
      } 
     }); 
+0

Хотя это исключает скрытие всех строк при выборе опции по умолчанию «-Выбрать-», она не обновляет таблицу, чтобы отображать все строки, что я хочу использовать по умолчанию. – Scott

+0

затем добавьте часть «else» для этого «if» и код для просмотра всех строк в соответствии с вашей логикой. –

+0

. Я не знаю, как это сделать. Вот почему я попросил о помощи, можете ли вы увидеть проблему в моем коде? – Scott

Смежные вопросы