diff --git a/development/issues/closed/212.html b/development/issues/closed/212.html
new file mode 100644
index 0000000000000000000000000000000000000000..5a80b617667fe9cc1abdec12c44a2bf99c52431b
--- /dev/null
+++ b/development/issues/closed/212.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>select label is not translated when the value is transferred #212</title>
+ <script src="./212.mjs" type="module"></script>
+</head>
+<body>
+<h1>select label is not translated when the value is transferred #212</h1>
+<p>select label is not translated when the value is transferred</p>
+<ul>
+ <li><a href="https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/212">Issue #212</a></li>
+ <li><a href="/">Back to overview</a></li>
+</ul>
+<main>
+
+ <monster-select value="1000"
+ data-monster-option-url="/issue-212.json"
+ data-monster-option-features-lazyload="true"
+ data-monster-option-mapping-labeltemplate="name"
+ data-monster-option-mapping-valuetemplate="id"
+ ></monster-select>
+
+</main>
+</body>
+</html>
diff --git a/development/issues/closed/212.mjs b/development/issues/closed/212.mjs
new file mode 100644
index 0000000000000000000000000000000000000000..1cf6d13b456ff5fb83513156f70a835c3eb9976c
--- /dev/null
+++ b/development/issues/closed/212.mjs
@@ -0,0 +1,13 @@
+/**
+ * @file development/issues/open/212.mjs
+ * @url https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/212
+ * @description select label is not translated when the value is transferred
+ * @issue 212
+ */
+
+import "../../../source/components/style/property.pcss";
+import "../../../source/components/style/normalize.pcss";
+import "../../../source/components/style/typography.pcss";
+import "../../../source/components/style/link.pcss";
+import "../../../source/components/style/color.pcss";
+import "../../../source/components/form/select.mjs";
diff --git a/source/components/form/select.mjs b/source/components/form/select.mjs
index c2dc02e6dddb8904b80cee007760f1628ccef958..57a1e9f63794f3e8dbd26146064f71de36bf6b26 100644
--- a/source/components/form/select.mjs
+++ b/source/components/form/select.mjs
@@ -696,20 +696,21 @@ class Select extends CustomControl {
let result;
const selection = this.getOption("selection");
+ let newValue = [];
if (selection) {
- result = setSelection.call(this, selection);
+ newValue = selection
} else if (this.hasAttribute("value")) {
- result = setSelection.call(this, this.getAttribute("value"));
- } else {
- result = setSelection.call(this, []);
+ newValue = this.getAttribute("value");
}
+ result = setSelection.call(this, newValue);
setTimeout(() => {
+ checkOptionState.call(this);
setStatusOrRemoveBadges.call(this, "closed");
- resolve();
+ resolve(result);
}, 10);
- return result;
+ return
}
setStatusOrRemoveBadges.call(this, "error");
@@ -1865,6 +1866,7 @@ function areOptionsAvailableAndInit() {
* @throws {Error} no shadow-root is defined
*/
function checkOptionState() {
+
if (!this.shadowRoot) {
throw new Error("no shadow-root is defined");
}
@@ -1889,6 +1891,8 @@ function checkOptionState() {
if (e.checked !== false) e.checked = false;
}
}
+
+
}
/**
@@ -1972,7 +1976,16 @@ function setSelection(selection) {
selection = [];
}
- this.setOption("selection", validateArray(selection));
+ validateArray(selection)
+
+ for (let i = 0; i < selection.length; i++) {
+ selection[i] = {
+ label: getSelectionLabel.call(this, selection[i].value),
+ value: selection[i].value,
+ };
+ }
+
+ this.setOption("selection", selection);
checkOptionState.call(this);
try {
@@ -2099,9 +2112,11 @@ function show() {
if (lazyLoadFlag === true) {
this[lazyLoadDoneSymbol] = true;
setStatusOrRemoveBadges.call(this, "loading");
-
+
new Processing(200, () => {
- this.fetch().catch((e) => {
+ this.fetch().then(() => {
+ checkOptionState.call(this);
+ }).catch((e) => {
addAttributeToken(this, ATTRIBUTE_ERRORMESSAGE, e.message);
setStatusOrRemoveBadges.call(this, "error");
});