1
0
forked from ScoDoc/ScoDoc

fixes multi-select (form + groups)

This commit is contained in:
Iziram 2024-08-24 18:24:46 +02:00
parent bdc6c90bfc
commit 871e85ae26
3 changed files with 11 additions and 6 deletions

View File

@ -747,7 +747,7 @@ def groups_table(
name="options",
html_id="group_list_options",
)
multi_select.change_event("change_list_options(event.target.value);")
multi_select.change_event("change_list_options(values);")
H.extend(
# ;
[

View File

@ -54,6 +54,8 @@ function change_list_options(selected_options) {
var option = options[i];
if ($.inArray(option, selected_options) >= 0) {
urlParams.set(option, "1");
} else {
urlParams.delete(option);
}
}
window.location = url.href;

View File

@ -20,7 +20,8 @@
<multi-select>.values() => ["val1",...]
<multi-select>.values(["val1",...]) => // sélectionne les options correspondantes (ne vérifie pas les options "single")
<multi-select>.on("change", (values) => {}) => // écoute le changement de valeur
<multi-select>.on((values) => {}) => // écoute le changement de valeur
<multi-select>.format((values)=>{}) // modifie les valeurs avant d'être envoyées / récupérées. values est un tableau des valeurs des options sélectionnées
*/
class MultiSelect extends HTMLElement {
@ -247,8 +248,6 @@ class MultiSelect extends HTMLElement {
(checkbox) => checkbox.checked
);
const values = checkedBoxes.map((checkbox) => checkbox.value);
const opts = checkedBoxes.map((checkbox) => {
return this.querySelector(`option[value="${checkbox.value}"]`);
});
@ -263,6 +262,9 @@ class MultiSelect extends HTMLElement {
btn.textContent = `${checkedBoxes.length} sélections`;
}
this.dispatchEvent(new Event("change"));
// update the form values
this._internals.setFormValue(this._values());
}
_values(newValues = null) {
@ -284,7 +286,6 @@ class MultiSelect extends HTMLElement {
checkbox.checked = newValues.includes(checkbox.value);
});
this._internals.setFormValue(this._values());
this._updateSelect();
}
}
@ -298,7 +299,9 @@ class MultiSelect extends HTMLElement {
}
on(callback) {
this.addEventListener("change", callback);
this.addEventListener("change", () => {
callback(this._values());
});
}
format(callback) {