showing variable content with datalist JS / mark some output as a variable name

Question

So,I want to create a program,which can show me something,if I enter something (with the help of a datalist).

Because I don´t want to code for every possibility,I want to ask,if you can say,that the value of the Textbox should show the text inside of the variable with the name of the textbox.

One example :

There it would be nice,to be able to say : the variable with the name of document.getElementById("boxP").value should be shown(in this case : success)

<input type="text" name="srch" id="boxP" list="datalist1""></input>



<datalist id="datalist1">


<option value="TEST">

<option value="TEST1">


</datalist>

<script>
var TEST = "sucessful"

</script>

I don´t think,that you can do that(/ mark some output as a variable name),but it's worth a try,I think.

I´m happy about every answer!

You can use an object for that – Rainbow May 10 '18 at 14:27 — Rainbow, May 10 '18 at 14:27

score 0 · Answer 1 · answered May 10 '18 at 14:28

Try using a map inside of an eventListener:

document.getElementById('datalist1').addEventListener('input', function () {
   document.getElementById('boxP').value = textMap[this.value];
});

var textMap = {
  'TEST': 'successful',
  'TEST1': 'successful2'
};

score 0 · Accepted Answer · answered May 10 '18 at 14:33

You can use an object, Define all the possibilities, Then index on it using the selected value from the Datalist.

var Obj = {
 'TEST': 'successful',
 'TEST1': 'successful1'
};
document.getElementById('boxP').addEventListener('change', function (e) {
   this.value = Obj[e.srcElement.value] || "";
});

<input type="text" name="srch" id="boxP" list="datalist1">



<datalist id="datalist1">
<option value="TEST">
<option value="TEST1">
</datalist>

showing variable content with datalist JS / mark some output as a variable name

2 Answers2