Ask A Question

Notifications

You’re not receiving notifications from this thread.

TypeError: $(...).chosen is not a function

Vikram Sharma asked in General

I am using Rails 6. I have installed jQuery, Bootstrap, & Popper as explained in one of the videos and Bootstrap is working fine. Now I have to use Chosen jQuery plugin.

I installed it using Yarn

yarn add ssh://git@github.com:harvesthq/chosen.git#7149a2aed86d4d815f1497f27ae602ed898b9b02

which outputted

yarn add v1.15.2
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@1.2.8: The platform "linux" is incompatible with this module.
info "fsevents@1.2.8" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > webpack-dev-server@3.3.1" has unmet peer dependency "webpack@^4.0.0".
warning "webpack-dev-server > webpack-dev-middleware@3.6.2" has unmet peer dependency "webpack@^4.0.0".
[4/4] Building fresh packages...
success Saved lockfile.
success Saved 1 new dependency.
info Direct dependencies
└─ chosen@1.8.7
info All dependencies
└─ chosen@1.8.7
Done in 158.62s.
In environment.js I added
environment.plugins.append(
  "Provide",
  new webpack.ProvidePlugin ({
    $: 'jquery',
    jQuery: 'jquery',
    Popper: ['popper.js', 'default'],
    Chosen: ['chosen.js', 'default']
  })
)

In my application.js I have

document.addEventListener("turbolinks:load", () => {
  $('[data-toggle="tooltip"]').tooltip()
  $('[data-toggle="popover"]').popover()
  $("#course_instructor_ids").chosen()
})

Which gives me the error (in web console)

TypeError: $(...).chosen is not a function[Learn More]

If I add the following to application.js

import chosen from "chosen"

I get

Error: Cannot find module 'chosen'

Any help will be life saving :)

Reply

@chris OliverOliverOliverOliverOliverOliveOliverOlive

Reply

i'm facing the same issue

Reply
Join the discussion
Create an account Log in

Want to stay up-to-date with Ruby on Rails?

Join 79,047+ developers who get early access to new tutorials, screencasts, articles, and more.

    We care about the protection of your data. Read our Privacy Policy.

    Screencast tutorials to help you learn Ruby on Rails, Javascript, Hotwire, Turbo, Stimulus.js, PostgreSQL, MySQL, Ubuntu, and more.

    © 2023 GoRails, LLC. All rights reserved.