How to Get Value of Selected Radio Button

How to get value of selected radio button?

var rates = document.getElementById('rates').value;

The rates element is a div, so it won't have a value. This is probably where the undefined is coming from.

The checked property will tell you whether the element is selected:

if (document.getElementById('r1').checked) {
rate_value = document.getElementById('r1').value;
}

Or

$("input[type='radio'][name='rate']:checked").val();

Set selected radio from radio group with a value

With the help of the attribute selector you can select the input element with the corresponding value. Then you have to set the attribute explicitly, using .attr:

var value = 5;
$("input[name=mygroup][value=" + value + "]").attr('checked', 'checked');

Since jQuery 1.6, you can also use the .prop method with a boolean value (this should be the preferred method):

$("input[name=mygroup][value=" + value + "]").prop('checked', true);

Remember you first need to remove checked attribute from any of radio buttons under one radio buttons group only then you will be able to add checked property / attribute to one of the radio button in that radio buttons group.

Code To Remove Checked Attribute from all radio buttons of one radio button group -

$('[name="radioSelectionName"]').removeAttr('checked');

How to get the selected radio button’s value?

You can do something like this:

var radios = document.getElementsByName('genderS');
for (var i = 0, length = radios.length; i < length; i++) { if (radios[i].checked) { // do whatever you want with the checked radio alert(radios[i].value);
// only one radio can be logically checked, don't check the rest break; }}
<label for="gender">Gender: </label><input type="radio" name="genderS" value="1" checked="checked">Male</input><input type="radio" name="genderS" value="0">Female</input>

Getting the value of a checked radio button using javascript

function getValue() {  var value = document.querySelector('input[name="style"]:checked').value;  console.log(value);}
<form>     <input type="radio" name="style" value="3" checked>     <input type="radio" name="style" value="5">     <input type="radio" name="style" value="10">     <button type="button" onclick="getValue()">click</button></form>

Javascript Get Selected Radio Button Values

You can use radio.getAttribute('data-price') to get the price of the pizza and radio.value to get the size of the pizza. Also note that you can avoid using [].slice.call by using [].filter.call on your NodeList.

var name = 'Cheese'
function addBasket(button) { var nodes = document.getElementsByName(button.name) var radio = [].filter.call(nodes, function(e) { return e.checked })[0]
var pizzaname = button.name var pizzadesc = button.getAttribute('data-description')
var pizzasize = radio.value var pizzaprice = radio.getAttribute('data-price')
console.log({ Name: pizzaname, Description: pizzadesc, Size: pizzasize, Price: pizzaprice })}
<td>  <table border="0" cellpadding="0">    <tbody>      <tr align="center">        <td>          <input name="Cheese" data-price="6.50" value="Small" type="radio" checked>Small        </td>        <td>          <input name="Cheese" data-price="8.50" value="Medium" type="radio">Medium        </td>        <td>          <input name="Cheese" data-price="9.99" value="Large" type="radio">Large        </td>      </tr>      <tr align="center">        <td style="padding-top: 6px">£6.50</td>        <td style="padding-top: 6px">£8.50</td>        <td style="padding-top: 6px">£9.99</td>      </tr>    </tbody>  </table></td><td>  <input id="addbasket" name="Cheese" data-description="Mozzarella cheese" value="Add to Basket" type="button" onclick="addBasket(this)"></td>

How to get selected radio button values?

$(document).ready(function() {  $('input:radio').change(function() {    var is_external = $("input[name='is_external']:checked").val();//name is is_external not radio    alert("selected values: " + is_external); //Return undefined  
});});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><div class="exter_inter">  External  <input type="radio" name="is_external" value="1" />Internal  <input type="radio" name="is_external" value="0" /></div>

How to get the value of the selected radio button?

In your radio button, analyze the parameters that you are passing:

gumb1 = Radiobutton(root,
text = "Euro",
value = "Euro",
variable = "btn2"

The parameters value and variable are what stores the data of the radio button. You've set your value option correctly. The interpreter will automatically set the variable with the value when the radio button is selected.

But here's where your issue is:

variable = "btn2"

"btn2" is a string. Not very useful though, is it? In fact, you're trying to perform methods on it that don't even exist. Such as here:

def funkcija():
X = btn2.get()

In fact, taking this information, you almost got there!

At the top of your script, you need to set btn2 to Tkinter's StringVar, like so:

from tkinter import *
btn1 = StringVar()
btn2 = StringVar()

Now that's done, let's change our parameters in our radio buttons.

gumb1 = Radiobutton(root,
text = "Euro",
value = "Euro",
variable = btn2

Now, Tkinter will automatically update the variable when it is selected. To get the value, do the same that you had done in your funkcija.

X = btn2.get()

And then the value of btn2 (which was updated by the radio buttons) will not be read, and stored into the variable X.

How to get selected radio button values in multiple radio button using Vuejs.?

Mybe something like following snippet:

new Vue({
el:"#demo",
data() {
return {
product_details: [{title: "Color", details: [{name: "Red", value: "red",}, {name: "Green", value: "green",}, {name: "Yellow", value: "yellow",},],}, {title: "Size", details: [{name: "Small", value: "small",},{name: "Large", value: "large",},],},],
products: [{name: 'Product 1', Color: 'red', Size: 'large'}, {name: 'Product 2', Color: 'green', Size: 'small'}]
}
}
})
.cont, .optionalitem, .input-group {
display: flex;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
<div v-for="(product, i) in products" :key="i">
<h3>{{ product.name }}</h3>
<form @submit.prevent="submit">
<div v-for="(variants, index) in product_details" :key="index" class="cont">
<p><b>Choose {{ variants.title }}</b> - </p>
<div class="input-group mt-2 increasenumber">
<div
class="optionalitem"
v-for="(detail, index1) in variants.details"
:key="index1 + variants.title"
>
<input
type="radio"
:id="index + '_' + index1"
class="newoneche"
:value="detail.value"
v-model="products[i][variants.title]"
/>
<label :for="index + '_' + index1" class="select01">
<p class="highlight">
{{ detail.name }}
</p>
</label>
</div>
</div>
</div>
{{product}}
<button color="success">Submit</button>
</form>
</div>
</div>


Related Topics



Leave a reply



Submit