javascript - How I change a value of hidden file according which radio selected -

i have in file html.twig:

1- hidden file should take 3 values according radio selected, 1 database , 2 others hiden files values number 10, this:

<input type="hidden" name="lt" value="{{ price.getlt }}"> <input type="hidden" name="lt" value="10"> <input type="hidden" name="lt" value="10"> 

2- , have 3 radiobox:

<input id="spa-price" name="price" class="w3-radio" value="spare {{ price.getspareprice }}" type="radio"> <input id="rep-price" name="price" class="w3-radio" value="repair{{ price.getrepairprice }}" type="radio"> <input id="rep-price" name="price" class="w3-radio" value="test {{ price.gettestprice }}" type="radio"> 

3- did block javascript in same file html.twig created function value of each radio:

{% block javasc %} <script>         function valuelt(){           var spare= document.getelementbyid('spa-price');           var repair= document.getelementbyid('rep-price');           var test= document.getelementbyid('tes-price');            if (repair.checked){ // should take value 10               alert("repair checked");               //<input type="hidden" name="lt" value="10">            } else if (test.checked){ // should take value 10              alert("test checked");              //<input type="hidden" name="lt" value="10">            } else {              alert("spare checked"); // should take value db             // <input type="hidden" name="lt" value="{{ price.getlt }}">         }      </script> {% endblock %} 

can tell me how change value of hidden file according each radio selected in function ? thank you.

change name values of hidden inputs

<input type="hidden" name="lt" data-id="spare" value="{{ price.getlt }}"> <input type="hidden" name="lt" data-id="repair" value="10"> <input type="hidden" name="lt" data-id="test" value="10"> 

add following lines appropiate if else clauses:

document.queryselector("input[data-id='spare']").value = spare.value; document.queryselector("input[data-id='repair']").value = repair.value; document.queryselector("input[data-id='test']").value = test.value; 

i'm introducing unique data properties in hiddens. in way can select them using document.queryselector , assign correct value.

you can select html-elements document.queryselector , css-selectors