Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How to know the value of a live radio button with javascript

I’m trying to retrieve the value of a radio button without validation or button.

When the user changes the radio button I want to retrieve the live value.

I have already tried a lot of code but none worked.

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

var az = document.querySelector("input[name='promotioncases']").checked = true;
console.log(az);

var selectedValue = $("input.promotioncases:checked").val();
console.log(selectedValue);

var selectedRadioValue = $("input.promotioncases:checked").attr("radio-value");
console.log(selectedRadioValue);

const promotion = document.getElementsByName('promotioncases')
for (e of promotion) {
  if (e.checked)
    console.log(`Elément ${e.id} coché`)
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input
  type="radio"
  name="promotioncases"
  class="promotioncases"
  id="black"
  data-target="10"
  data-nom="POSTE-ENVELLOPPE-belgique"
  value="10" />
  
<input
  type="radio"
  name="promotioncases"
  class="promotioncases"
  id="red"
  data-target="20"
  data-nom="POSTE-ENVELLOPPE-belgique"
  value="20" />

<input
  type="radio"
  name="promotioncases"
  class="promotioncases"
  id="vert"
  data-target="30"
  data-nom="POSTE-ENVELLOPPE-belgique"
  value="30" />

>Solution :

$('input[name="promotioncases"]').on('click', function() {
    console.log($(this).attr('data-target'))
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input
  type="radio"
  name="promotioncases"
  class="promotioncases"
  id="black"
  data-target="10"
  data-nom="POSTE-ENVELLOPPE-belgique"
  value="10" />
  
<input
  type="radio"
  name="promotioncases"
  class="promotioncases"
  id="red"
  data-target="20"
  data-nom="POSTE-ENVELLOPPE-belgique"
  value="20" />

<input
  type="radio"
  name="promotioncases"
  class="promotioncases"
  id="vert"
  data-target="30"
  data-nom="POSTE-ENVELLOPPE-belgique"
  value="30" />
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading