0

我正在研究rails中的自动完成部分。我正在使用'jquery-ui-rails' gem。虽然使用$(document).ready它正在工作,但$( document ).on('turbolinks:load', function() {}由于物化链轮,我使用它不工作。

如果我在 application.js 中删除 //= require materialize-sprockets 那么它就可以工作了。如果我添加该行,则它不起作用。我需要物化链轮用于设计目的。

宝石文件

source 'https://rubygems.org'
git_source(:github) { |repo| "https://github.com/#{repo}.git" }

ruby '2.5.1'

# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '~> 5.2.2'
# Use sqlite3 as the database for Active Record
gem 'jquery-rails'
gem 'jquery-ui-rails'
gem 'materialize-sass'
gem 'sqlite3'
# Use Puma as the app server
gem 'puma', '~> 3.11'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 5.0'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# See https://github.com/rails/execjs#readme for more supported 
runtimes
# gem 'mini_racer', platforms: :ruby

# Use CoffeeScript for .coffee assets and views
gem 'coffee-rails', '~> 4.2'
# Turbolinks makes navigating your web application faster. Read 
more: https://github.com/turbolinks/turbolinks
gem 'turbolinks', '~> 5'
gem 'jquery-turbolinks'
# Build JSON APIs with ease. Read more: 
https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.5'

应用程序.js

//= require jquery
//= require jquery-ui
//= require rails-ujs
//= require jquery-ui/widgets/autocomplete
//= require autocomplete-rails
//= require materialize-sprockets
//= require activestorage
//= require turbolinks
//= require_tree .

_form.html.erb

  <div class="field">
  <%= f.label :category_id %><br />
  <%= f.text_field :category_name, data: { autocomplete_source: 
  categories_path} %>
  </div>

类别控制器.rb

  def index
  @categories = Category.order(:name).where("name like ?", "%# 
  {params[:term]}%")
  render json: @categories.map(&:name)
  end

产品.js

$( document ).on('turbolinks:load', function() {
$("input#product_category_name").autocomplete({
source: $('#product_category_name').data('autocomplete-source')
});
})

路线.rb

resources :products
resources :categories

如何使用 $( document ).on('turbolinks:load') 和 //= require materialize-sprockets ?

4

0 回答 0