Как динамически отображать результаты поиска в качестве пользовательских типов в окне поиска (Rails 6 & Webpacker)

Question

В моем приложении rails 6 у меня есть функция поиска с самоцветом Ransack. Я получаю правильные результаты поиска, когда нажимаю «ввод» после ввода запроса в строке поиска. Тем не менее, я предпочитаю, чтобы поиск был динамически загружен, поскольку пользователь вводит в строке поиска, не нажимая «enter».

В моем индексе. html .erb, у меня есть форма поиска Ransack, как это

<%= search_form_for @search, :class => 'jobs_search' do |f| %>
  <%= f.search_field :salary_or_job_type_or_title_cont, placeholder: "search" %>
<% end %>
<div class="col-md-8">
  <div class="jobs"><%= render 'jobs' %></div>
</div>

в индексе. js .erb, у меня есть

$(".jobs").html("<%= escape_javascript(render("jobs")) %>");

в моем поиске. js, у меня есть

$(".jobs_search").keyup(function() {
  $.get($(".jobs_search").attr("action"), $(".jobs_search").serialize(), null, "script");
  return false;
});

В application. js,

require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("jquery")

require("bootstrap/dist/js/bootstrap")

require("../search")


require("trix")
require("@rails/actiontext")

Я хотел бы знать, как я могу достичь желаемых результатов динамической загрузки результатов поиска по мере того, как пользователь вводит в строке поиска.