Change multiple labels on dropdown select (+database query)

Question

After selecting from a dropdown list I want multiple textboxes / labels to change.

I have a SQL database which basically has an article number and multiple information which are linked to it, weight, price, and so on.

I've created a dropdown list in PHP. I want to get this list filled with the article numbers (not the problem), and the labels next to the dropdown have to show the linked information of the selected article.

I already tried the onChange-function but it only allows me to display one information. https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onchange

// okay update, after some more research I found out, that it is indeed possible to have multiple values assigned to a dropdown option. It is necessary to split the values again afterwards with php https://stackoverflow.com/a/16229998/2524404 but I need this to happen on change.

score 0 · Answer 1 · answered Feb 11 '19 at 15:14

was able to find the solution on my own:

<!DOCTYPE html>
<html>
<body>

<select id="mySelect" onchange="myFunction()">
  <option value="">
  <option value="1|3|X">XYZ
  <option value="2|2|Y">ABC
</select>

<p id="demo"></p>

<script>
function myFunction() {
  var x = document.getElementById("mySelect").value.split("|");
  document.getElementById("demo").innerHTML = x[2];
}
</script>

</body>
</html>

Change multiple labels on dropdown select (+database query)

1 Answers1