<input type="radio" name="programming" id="" value="HTML">HTML</input>
<input type="radio" name="programming" id="" value="C++">C++ </input>
<input type="radio" name="programming" id="" value="JavaScript">JavaScript </input>
<input type="radio" name="programming" id="" value="Python">Python</input>
<button type="submit" class="submit">check</button>
Here is my html code I'm trying to get the value of the selected radio element after the click of the button element.
You can get the value with JavaScript with :
document.querySelector('input[name="programming"]:checked').value
<input type="radio" name="programming" id="" value="HTML">HTML</input>
<input type="radio" name="programming" id="" value="C++">C++ </input>
<input type="radio" name="programming" id="" value="JavaScript">JavaScript </input>
<input type="radio" name="programming" id="" value="Python">Python</input>
<button type="submit" id="submitBtn" class="submit">check</button>
<script>
document.getElementById('submitBtn').onclick = function(){
let val = document.querySelector('input[name="programming"]:checked').value;
console.log('Choosen: ', val)
}
</script>
Try this code :
const btnSubmit = document.querySelectorAll('input[type="submit"]');
btnSubmit.addEventListener('click', e => {
let checkedInputValue = document.querySelectorAll('input[name="programming"]:checked').value;
console.log(checkedInputValue);
});