3
0
mirror of https://github.com/snipe/snipe-it.git synced 2026-08-18 11:15:42 +00:00

Merge pull request #19483 from grokability/fixed-livewire-select2-in-importer

Importer: Fix for Livewire+modal+select2 search
This commit is contained in:
snipe
2026-08-13 13:19:09 +01:00
committed by GitHub
4 changed files with 67 additions and 8 deletions

35
public/js/dist/all.js vendored
View File

@ -75428,8 +75428,33 @@ $(document).ready(function () {
* 3. Add an attribute called 'data-livewire-component' that points to $this->getId() (via `{{ }}` if you're in a blade,
* or just $this->getId() if not).
*/
// Any livewire-select2 that lives inside a Bootstrap 3 modal has to be
// initialized with dropdownParent set to the modal, or the search input
// gets appended to <body> where Bootstrap 3's modal enforceFocus handler
// immediately steals focus away from it - the dropdown opens, the search
// field renders, but typing does nothing because focus keeps snapping
// back into the modal on every keydown. Elements not in a modal get a
// plain init. Callers with fussier requirements (custom width, template,
// etc.) can still init select2 manually; this handler only touches
// elements that don't already have select2 wired up (guarded by the
// .select2-hidden-accessible class select2 adds after init).
function initLivewireSelect2($scope) {
var $root = $scope && $scope.length ? $scope : $(document);
$root.find('.livewire-select2').each(function () {
var $el = $(this);
if ($el.hasClass('select2-hidden-accessible')) {
return;
}
var opts = {};
var $modal = $el.closest('.modal');
if ($modal.length) {
opts.dropdownParent = $modal;
}
$el.select2(opts);
});
}
document.addEventListener('livewire:init', function () {
$('.livewire-select2').select2();
initLivewireSelect2();
$(document).on('select2:select', '.livewire-select2', function (event) {
var target = $(event.target);
if (!event.target.name || !target.data('livewire-component')) {
@ -75447,9 +75472,13 @@ document.addEventListener('livewire:init', function () {
Livewire.interceptMessage(function (_ref) {
var onFinish = _ref.onFinish;
onFinish(function () {
// Runs after DOM morph completes (or on error/cancel)
// Runs after DOM morph completes (or on error/cancel). Livewire
// replaces the plain <select> nodes on morph, so a re-init picks
// up any that lost their select2 wrapper in the swap. The
// already-init guard inside initLivewireSelect2 keeps unchanged
// elements untouched.
queueMicrotask(function () {
$(".livewire-select2").select2();
initLivewireSelect2();
});
});
});

File diff suppressed because one or more lines are too long

View File

@ -1,5 +1,5 @@
{
"/js/dist/all.js": "/js/dist/all.js?id=f00faad4ec2747af7dd5492bf173cf4c",
"/js/dist/all.js": "/js/dist/all.js?id=2c22fbc200ecdda01cad9bbb465f1287",
"/css/build/overrides.css": "/css/build/overrides.css?id=95a1ea67691a4af8eec7a4ab83b15551",
"/css/build/app.css": "/css/build/app.css?id=acd643dcd311c216a1c65c37d640e6d7",
"/css/build/AdminLTE.css": "/css/build/AdminLTE.css?id=ee0ed88465dd878588ed044eefb67723",

View File

@ -945,8 +945,34 @@ $(document).ready(function () {
* 3. Add an attribute called 'data-livewire-component' that points to $this->getId() (via `{{ }}` if you're in a blade,
* or just $this->getId() if not).
*/
// Any livewire-select2 that lives inside a Bootstrap 3 modal has to be
// initialized with dropdownParent set to the modal, or the search input
// gets appended to <body> where Bootstrap 3's modal enforceFocus handler
// immediately steals focus away from it - the dropdown opens, the search
// field renders, but typing does nothing because focus keeps snapping
// back into the modal on every keydown. Elements not in a modal get a
// plain init. Callers with fussier requirements (custom width, template,
// etc.) can still init select2 manually; this handler only touches
// elements that don't already have select2 wired up (guarded by the
// .select2-hidden-accessible class select2 adds after init).
function initLivewireSelect2($scope) {
var $root = $scope && $scope.length ? $scope : $(document);
$root.find('.livewire-select2').each(function () {
var $el = $(this);
if ($el.hasClass('select2-hidden-accessible')) {
return;
}
var opts = {};
var $modal = $el.closest('.modal');
if ($modal.length) {
opts.dropdownParent = $modal;
}
$el.select2(opts);
});
}
document.addEventListener('livewire:init', () => {
$('.livewire-select2').select2()
initLivewireSelect2();
$(document).on('select2:select', '.livewire-select2', function (event) {
var target = $(event.target)
@ -965,9 +991,13 @@ document.addEventListener('livewire:init', () => {
Livewire.interceptMessage(({ onFinish }) => {
onFinish(() => {
// Runs after DOM morph completes (or on error/cancel)
// Runs after DOM morph completes (or on error/cancel). Livewire
// replaces the plain <select> nodes on morph, so a re-init picks
// up any that lost their select2 wrapper in the swap. The
// already-init guard inside initLivewireSelect2 keeps unchanged
// elements untouched.
queueMicrotask(() => {
$(".livewire-select2").select2();
initLivewireSelect2();
});
});
}