Install select2 and jQuery
Copy
Create select2 controller
1
yarn add select2 jquery
Copy
app/frontend/controllers/select2_controller.js
1
2
3
4
5
6
7
8
9
10
11
import { Controller } from "@hotwired/stimulus"
import $ from 'jquery';
import 'select2/dist/css/select2.min.css'
import Select2 from "select2"
export default class extends Controller {
connect() {
Select2()
$('.select2').select2();
}
}
Copy
app/frontend/controllers/index.js
1
2
import Select2Controller from "./select2_controller"
application.register("select2", Select2Controller)
Use select2 in views
Copy
*.html.slim
1
2
3
4
div data-controller="select2"
= f.input :product_id,
collection: Product.all,
input_html: { class: 'select2' }
Updated by Yuto at 2023-05-09 21:05