webpack-bootstrap-ui-kit/src/js_old/_components/_ui.form.select2.js

98 lines
2.0 KiB
JavaScript
Raw Normal View History

2022-05-03 20:50:57 +02:00
'use strict'
2021-01-14 19:13:57 +01:00
2022-05-03 20:50:57 +02:00
import $ from 'jquery'
2021-01-14 19:13:57 +01:00
2022-05-03 20:50:57 +02:00
import select2 from 'select2/dist/js/select2.js'
import Events from '../_events'
2021-01-14 19:13:57 +01:00
const FormSelect2 = (($) => {
// Constants
2022-05-03 20:50:57 +02:00
const NAME = 'jsFormSelect2'
const DATA_KEY = NAME
const $Html = $('html, body')
const W = window
const D = document
2021-01-14 19:13:57 +01:00
class FormSelect2 {
2022-05-03 20:50:57 +02:00
constructor (el) {
const ui = this
const $el = $(el)
2021-01-14 19:13:57 +01:00
2022-05-03 20:50:57 +02:00
ui._el = el
ui.dispose()
2021-01-14 19:13:57 +01:00
2022-05-03 20:50:57 +02:00
console.log(`${NAME}: init`)
$el.data(DATA_KEY, this)
2021-01-14 19:13:57 +01:00
2022-05-03 20:50:57 +02:00
const $fields = $el.find(Events.FORM_FIELDS)
2021-01-14 19:13:57 +01:00
const $selectFields = $el
2022-05-03 20:50:57 +02:00
.find('select:not([readonly])')
.not('.no-select2')
2021-01-14 19:13:57 +01:00
$selectFields.each((i, el) => {
2022-05-03 20:50:57 +02:00
$(el).select2()
})
2021-01-14 19:13:57 +01:00
2022-05-03 20:50:57 +02:00
$el.addClass(`${NAME}-active`)
$el.trigger(Events.FORM_INIT_BASICS)
2021-01-14 19:13:57 +01:00
}
// Public methods
2022-05-03 20:50:57 +02:00
dispose () {
console.log(`${NAME}: dispose`)
const ui = this
2021-01-14 19:13:57 +01:00
2022-05-03 20:50:57 +02:00
const $el = $(ui._el)
2021-01-14 19:13:57 +01:00
const $selectFields = $el
2022-05-03 20:50:57 +02:00
.find('select:not([readonly])')
.not('.no-select2')
2021-01-14 19:13:57 +01:00
$selectFields.each((i, el) => {
2022-05-03 20:50:57 +02:00
const $el = $(el)
if ($el.hasClass('select2-hidden-accessible')) {
$el.select2('destroy')
2021-01-14 19:13:57 +01:00
}
2022-05-03 20:50:57 +02:00
})
2021-01-14 19:13:57 +01:00
2022-05-03 20:50:57 +02:00
$.removeData(ui._el, DATA_KEY)
ui._el = null
$el.removeClass(`${NAME}-active`)
2021-01-14 19:13:57 +01:00
}
2022-05-03 20:50:57 +02:00
static _jQueryInterface () {
2021-01-14 19:13:57 +01:00
return this.each(() => {
// attach functionality to el
2022-05-03 20:50:57 +02:00
const $el = $(this)
let data = $el.data(DATA_KEY)
2021-01-14 19:13:57 +01:00
if (!data) {
2022-05-03 20:50:57 +02:00
data = new FormSelect2(this)
$el.data(DATA_KEY, data)
2021-01-14 19:13:57 +01:00
}
2022-05-03 20:50:57 +02:00
})
2021-01-14 19:13:57 +01:00
}
}
// jQuery interface
2022-05-03 20:50:57 +02:00
$.fn[NAME] = FormSelect2._jQueryInterface
$.fn[NAME].Constructor = FormSelect2
2021-01-14 19:13:57 +01:00
$.fn[NAME].noConflict = function () {
2022-05-03 20:50:57 +02:00
$.fn[NAME] = JQUERY_NO_CONFLICT
return FormSelect2._jQueryInterface
}
2021-01-14 19:13:57 +01:00
const init = () => {
2022-05-03 20:50:57 +02:00
$('form').jsFormSelect2()
}
2021-01-14 19:13:57 +01:00
// auto-apply
$(W).on(`${NAME}.init ${Events.AJAX} ${Events.LOADED}`, () => {
2022-05-03 20:50:57 +02:00
init()
})
2021-01-14 19:13:57 +01:00
2022-05-03 20:50:57 +02:00
return FormSelect2
})($)
2021-01-14 19:13:57 +01:00
2022-05-03 20:50:57 +02:00
export default FormSelect2