Html does not render radio button value

Asked

Viewed 216 times

-1

I need to get the value of input radio inside a modal bootstrap, but it does not render the value stays that way:

inserir a descrição da imagem aqui

I used this example of radios:

<div id="itemList">
<input type="radio" value ="1" class="overWrite" name="overWrite"  />Yes
<input type="radio" value ="2" class="overWrite" name="overWrite"  />No 
</div>

In debug, I realized that when I get the value right by loading the page this way:

    $(document).ready(function(){

     var overwrite = $('#itemList input:radio:checked').val();

     alert('value = ' + overwrite);
  });

It can capture the value of the input, but when caught through change or click it returns empty:

    $("input[type='radio']").click(function () {
    var radioValue = $(this).val();
    alert(radioValue);
});

When the modal is loaded on the page the radio input loses its value, in the same form there are other inputs, but this happens only with the radio button. Does anyone know why?

html

  • Probably this 'value' is being set dynamically to empty, so when you just load the document it is there and when you pull the 'click' it is no longer there.

1 answer

0


The inputs of the type radio are best used for the submission of a form, because the name both must be equal.

To pay the value dynamically, the best way is to use the tag select, she replaces the input radio and solves the problems.

<!doctype html>
<html>
  <body>
    <select id="option">
      <option value="Yes">Sim</option>
      <option value="No">Não</option>
    </select>
    <input type="button" value="Click" onclick="alert(document.getElementById('option').value);">
  </body>
</html>

  • This is not a solution of the problem, besides that, depending on the system, worsens the usability, since with "Select" will be necessary 2 clicks to select an option.

  • @Jhonnyjks, I don’t think it would worsen usability, on the contrary, depending on the use, it can facilitate both the life of the developer and the life of the user (relative to the situation), for me, the answer is valid as a solution to the problem since the code is functional and meets the requirements of the author of the post, just need to make the necessary adaptations.

  • @Victorgomes, if the user will have to give 2 clicks where it would have only 1, the usability got worse! It’s not me who says it, it’s the study. More clicks/taps, less usability. The fact that the author considered the answer as "best answer" does not make it the solution to the problem, only the best answer, where the author will leave aside the problem to do differently.

  • @Jhonnyjks, even if it increases the "1" click during the process, one should look at the feasibility, to work with input radio dynamically (like the above code case), some problems may appear. That’s why in html there are several other components that in the end are the same thing input button and button, meter and progress, etc..

  • Hey @Brumazzid.B., there may be better elements, but this element of the answer is not one of those! If you put any other element that also needs only 1 click, I will never claim that it is not a good means to the end.

Browser other questions tagged html

You are not signed in. Login or sign up in order to post.