Подстановочный знак для фильтра jquery

#javascript #jquery #datatables

#javascript #jquery #таблицы данных

Вопрос:

Я использую приведенный ниже скрипт для фильтрации моей таблицы

 <script>
        $(document).ready(function() {
            $('#citylist').change(function() {
                var value = $('#citylist').val();
                $("#myTable tr").filter(function() {
                    $(this).toggle($(this).text().indexOf(value) > -1)
                });
            });
        });
    </script>
 

Это пример дизайна, который я собираюсь использовать

 <select class="form-control" id="citylist">
       <option value="val1">val1</option>
       <option value="val2">val2</option>
       <option value="val3">val3</option>
       <option value="val4">val4</option>
</select>
 

Функции работают нормально, без каких-либо конфликтов.

Я хочу очистить фильтр одним выбранным вариантом. Итак, я хочу знать, есть ли какой-либо подстановочный знак, например % , в sql, который можно использовать в качестве значения для параметра для выполнения этой задачи?

Я уже пробовал использовать * и % для значений параметра.

Любая помощь будет оценена

Комментарии:

1. Вы имеете в виду это ?

2. @Swati Да. Но я уже пробовал <option value="\*">City</option> , <option value="*">City</option> но ни один из них не работает

3. Пустая строка присутствует во всех строках. "foo".indexOf("") //=> 0 например. <option value="">all</option>

Ответ №1:

Если вы хотите сбросить фильтр (что, я думаю, вы подразумеваете под «очистить фильтр одним выбранным вариантом«), вы можете добавить опцию в свой раскрывающийся список, где значение является пустой строкой.

Например:

 <select class="form-control" id="citylist">
   <option value="">-- please select --</option>
   <option value="Edinburgh">Edinburgh</option>
   <option value="Tokyo">Tokyo</option>
   <option value="San Francisco">San Francisco</option>
   <option value="London">London</option>
</select>
 

Однако логика в $('#citylist').change(...) функции немного странная — она найдет только записи, которые находятся на отображаемой странице (поэтому, если вы используете подкачку, она не найдет соответствующие записи на других страницах), и она скроет строку заголовка вашей таблицы. Это потому, что вы ищете в DOM, а не в данных DataTables.

Возможно, это то, что вы на самом деле хотите, но это не то, как вы обычно выполняете фильтрацию в таблицах данных.

Если вы хотите выполнить поиск более обычным способом, вот пример:

 $(document).ready(function() {

  var table = $('#myTable').DataTable( {
    -- your usual table initialization goes here --
  } );

  $('#citylist').change(function() {
    var value = $('#citylist').val();
    table.columns(2).search( value, false, false ).draw();
  } );

} );
 

Предполагается, что у вас есть таблица, где City столбец является третьим столбцом в таблице ( table.columns(2) — первый столбец имеет нулевой индекс).

Логические значения в search( value, false, false ) представляют, хотите ли вы использовать регулярное выражение ( false ) и хотите ли вы использовать интеллектуальный поиск (также false ).

Вы можете прочитать документацию для search() получения полного объяснения.

Здесь также можно увидеть пример, в котором раскрывающийся поиск основан на использовании регулярного выражения. В вашем конкретном примере это не требуется (потому что вы сопоставляете все название города).