Adding bootstrap multi select to dxcc dropdown

This commit is contained in:
Andreas Kristiansen
2025-10-22 16:41:20 +02:00
parent 40c2706a2a
commit d1aabdd8bf
2 changed files with 18 additions and 0 deletions

View File

@@ -46,6 +46,7 @@ class Gridmap extends CI_Controller {
'assets/js/sections/gridmap.js?',
'assets/js/sections/itumap_geojson.js?' . filemtime(realpath(__DIR__ . "/../../assets/js/sections/itumap_geojson.js")),
'assets/js/sections/cqmap_geojson.js?' . filemtime(realpath(__DIR__ . "/../../assets/js/sections/cqmap_geojson.js")),
'assets/js/bootstrap-multiselect.js?' . filemtime(realpath(__DIR__ . "/../../assets/js/bootstrap-multiselect.js")),
];
$this->load->view('interface_assets/header', $data);

View File

@@ -8,6 +8,23 @@ document.addEventListener("DOMContentLoaded", function() {
}
});
});
$('#dxcc').multiselect({
// template is needed for bs5 support
templates: {
button: '<button type="button" class="multiselect dropdown-toggle btn btn-secondary form-select form-select-sm" data-bs-toggle="dropdown" aria-expanded="false"><span class="multiselect-selected-text"></span></button>',
},
enableFiltering: true,
enableFullValueFiltering: false,
enableCaseInsensitiveFiltering: true,
filterPlaceholder: lang_general_word_search,
numberDisplayed: 1,
inheritClass: true,
buttonWidth: '100%',
maxHeight: 600
});
$('.multiselect-container .multiselect-filter', $('#dxcc').parent()).css({
'position': 'sticky', 'top': '0px', 'z-index': 1, 'background-color':'inherit', 'width':'100%', 'height':'37px'
})
});
$('#band').change(function(){