Проблема в поисковом фильтре с помощью кнопки

Question

Я закончил фильтр поиска с помощью плагина Isotope, я хочу отфильтровать поиск с помощью кнопки.

Пример Введите значение поиска в поле ввода, а затем нажмите кнопку поиска, чтобы отобразить результат поиска. Как это сделать с кнопкой ..? Здесь html и js ниже и ссылка Codepen. Просмотр ссылки Codepen

$(function() {

  var $grid = $('#container');
  $grid.isotope({
    itemSelector: '.item'
  });

  var filters = [];  

  /*
  ||Auto-Search||
  $('#fname').on('keyup',function() {
      // debounce removed for brevity, but you'd put it here
      filters[0] = this.value;
      runFilter();
    });
  ||On Click-Search||
  $('#fname').on('click',function() {
      // debounce removed for brevity, but you'd put it here
      filters[0] = this.value;
      runFilter();
    });
  ||Enter-Key-Search||
  $('#search').on('keyup',function(e) {
      // debounce removed for brevity, but you'd put it here
      if (e.keyCode === 13) {
      filters[0] = this.value;
      runFilter();
      }
    });
  */
  //Button-Search  
  $('#btn').on('click', function() {
      filters[0] = this.value;
      runFilter();
  });

  $('#filter-select').on('change', function() {
    filters[1] = this.value;
    runFilter();
  });
 
  var runFilter = function() {
    $grid.isotope({
      filter: function() {
        if (filters[0]) {
          var qsRegex = new RegExp(filters[0], 'gi');
          if (!$(this).find('.content-title').text().match(qsRegex)) {
            return false;
          }
        }
        if (filters[1]) {
          if (!($(this).hasClass(filters[1]))) {
            return false;
          }
        }
        return true;
      }
    });
  }
});

<input type="text" id="search" placeholder="Search"></input>
<button type="submit" id="btn">Click Me</button>

Answer 1

Измените свою функцию для поиска кнопок в соответствии с этим. Если вы используете this.value, то вы используете значение button. Но на самом деле вам нужно значение поля input.

//Button-Search  
$('#btn').on('click', function() {
    filters[0] = $('#search')[0].value; // this line is changed
    runFilter();
});

Кодовый код здесь