select with images
parent
4149a28669
commit
078452474c
|
@ -604,28 +604,19 @@
|
|||
|
||||
// Remove the selected style from all items
|
||||
document.querySelectorAll('.shx-custom-enhanced-dropdown-font-dropdown-content div').forEach(div => {
|
||||
div.classList.remove('shx-custom-enhanced-dropdown-font-selected');
|
||||
div.classList.remove('shx-custom-enhanced-dropdown-variant-selected');
|
||||
});
|
||||
|
||||
// Add the selected style to the clicked item
|
||||
event.currentTarget.classList.add('shx-custom-enhanced-dropdown-font-selected');
|
||||
event.currentTarget.classList.add('shx-custom-enhanced-dropdown-variant-selected');
|
||||
|
||||
document.getElementById("shx-custom-enhanced-dropdown-font-dropdown-content").style.display = 'none';
|
||||
|
||||
// const currentTargetImage = event.currentTarget.querySelector("img")
|
||||
|
||||
// if (currentTargetImage !== null && currentTargetImage.src !== null) {
|
||||
//document.getElementById("shx-custom-enhanced-dropdown-variant-selected-image").src = event.currentTarget.querySelector("img").src
|
||||
// }
|
||||
}
|
||||
|
||||
function loadCustomEnhancedDropdownSelectedValue() {
|
||||
function loadCustomEnhancedDropdownDefaultSelectedValue() {
|
||||
// timeout is needed because the other elements needs to be added to the dom
|
||||
setTimeout(() => {
|
||||
const selectElement = document.querySelector('.shx-custom-enhanced-dropdown-font-hide-dummy-select');
|
||||
|
||||
console.log("selectElement", selectElement, "span", document.getElementById("shx-custom-enhanced-dropdown-font-select-selected-value"))
|
||||
|
||||
document.getElementById("shx-custom-enhanced-dropdown-font-select-selected-value").innerText = selectElement.value
|
||||
document.getElementById("shx-custom-enhanced-dropdown-font-select-selected-value").innerText = document.querySelector('.shx-custom-enhanced-dropdown-font-hide-dummy-select').value
|
||||
}, 10)
|
||||
};
|
||||
|
||||
|
@ -639,8 +630,6 @@
|
|||
let isInputShxFont = inputID === "shx-font"
|
||||
let customDropdownHtml = "";
|
||||
|
||||
console.log("isInputShxFont", isInputShxFont)
|
||||
|
||||
if (isInputShxFont) {
|
||||
customDropdownHtml += `
|
||||
<div class="shx-custom-enhanced-dropdown field custom">
|
||||
|
@ -670,8 +659,6 @@
|
|||
optionDisplayName = options[i];
|
||||
}
|
||||
|
||||
console.log("optionValue", optionValue, "displ", optionDisplayName)
|
||||
|
||||
html += `<option value="${optionValue}" ${inputVal === optionValue ? 'selected' : ''}>${optionDisplayName}</option>`;
|
||||
|
||||
if (isInputShxFont) {
|
||||
|
@ -690,9 +677,7 @@
|
|||
html += customDropdownHtml
|
||||
}
|
||||
|
||||
console.log("customDropdownHtml", customDropdownHtml)
|
||||
|
||||
loadCustomEnhancedDropdownSelectedValue()
|
||||
loadCustomEnhancedDropdownDefaultSelectedValue()
|
||||
|
||||
return html;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue