如何根据选择的无线电更改隐藏文件的值

I have in a file HTML.twig:

1- a hidden file should take 3 values according which radio selected, one from my database and two others hiden files values the number 10, like this:

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

2- And I 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- I did a block Javascript in the same file HTML.Twig I created a function to get the 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 the value 10
              alert("repair checked");
              //<input type="hidden" name="lt" value="10">

          } else if (test.checked){ // Should take the value 10
             alert("test checked");
             //<input type="hidden" name="lt" value="10">

          } else {
             alert("spare checked"); // should take the value from DB
            // <input type="hidden" name="lt" value="{{ price.getLt }}">
        }
     </script>
{% endblock %}

Can you tell me how I change the value of my hidden file according each radio selected in the function ? Thank you.

Change the name values of the 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 the following lines to the 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 the hiddens. In this way you can select them using document.querySelector and assign the correct value.

You can easily select HTML-elements with document.querySelector and CSS-selectors

First you need to change the name of your input hidden to be able to select them independently one from the other :

<input type="hidden" name="lt-spare" value="">
<input type="hidden" name="lt-repair" value="">
<input type="hidden" name="lt-test" value="">

I also removed the value since those will be added by the javascript later on.

<input id="spa-price" name="price" class="w3-radio" onchange='valueLt();' value="Spare {{ price.getSparePrice }}" type="radio">
<input id="rep-price" name="price" class="w3-radio" onchange='valueLt();' value="Repair{{ price.getRepairPrice }}" type="radio">
<input id="tes-price" name="price" class="w3-radio" onchange='valueLt();' value="Test {{ price.getTestPrice }}" type="radio">

I've noticed a mistake in your radios since the two last had the same name you wouldn't be able to distinct them in your JS and I also added a onchange() attribute to trigger your function.

<script>
        function valueLt(){
          var spare= document.getElementById('spa-price');
          var repair= document.getElementById('rep-price');
          var test= document.getElementById('tes-price');

          var hiddenSpare =   document.getElementsByName("lt-spare");
          var hiddenRepair =   document.getElementsByName("lt-repair");
          var hiddenTest =   document.getElementsByName("lt-test");

          if (repair.checked){ // Should take the value 10
              alert("repair checked");
              hiddenSpare.value = 10;
              hiddenRepair.value = 10;
              hiddenTest.value = repair.value;

          } else if (test.checked){ // Should take the value 10
             alert("test checked");
             hiddenSpare.value = 10;
             hiddenRepair.value = 10;
             hiddenTest.value = test.value;

          } else {
             alert("spare checked"); // should take the value from DB
             hiddenSpare.value = spare.value;
             hiddenRepair.value = 10;
              hiddenTest.value = 10;
            }
        }
     </script>

Here we add variables to select your input hidden that are now distincts. Then in your if on top of changing the desired input to the value of his radio we also set the two others to 10.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
{% block content %}
<input type="hidden" name="lt_filed" id="lt_filed" value="{{ price.getLt }}">

<input type="radio" name="price" value="{{ price.getSparePrice() }}">
<input type="radio" name="price" value="{{ price.getRepairPrice() }}">
<input type="radio" name="price" value="{{ price.getTestPrice() }}">
{% endblock %}

{% block javascript %}
<script>
$(function() {
    $('input[name="price"]').on('change', function() {
        $('#lt_filed').val($(this).val());
        console.log('Val set '+ $('#lt_filed').val());
    });
});
</script>
{% endblock %}

</div>