I am developing a small application in which I want to create 20 radio buttons in one row.
How can I do this using jQuery?
Add a comment
|
8 Answers
I think this will serve your purpose:
for (i = 0; i < 20; i++) {
var radioBtn = $('<input type="radio" name="rbtnCount" />');
radioBtn.appendTo('#target');
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="target"></div>
Comments
You can do it with appendTo(), within a for loop:
for (i = 0; i < 20; i++) {
$('<input type="radio" name="dynradio" />').appendTo('.your_container');
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="your_container"></div>
Comments
Something along the lines of:
for (i = 0; i < 20; i++) {
$('#element').append('<input type="radio" name="radio_name" />');
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="element"></div>
Comments
for (i = 0; i < 20; i++) {
$('<input type="radio" name="radiobtn" >Yourtext'+i+'</input>').appendTo('#container');
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container"></div>
Comments
This code will append radio buttons with unique id to each of them....
for (var i=0;i<=20;i++)
{
$("#yourcontainer").append("<input type='radio' id='myRadio"+i+"'>")
}
1 Comment
Palec
They don’t have any name, they’re useless.
You have to find the element that should contain your radio buttons and append() them:
var container = $('#radio_container');
for (var i = 0; i < 20; i++) {
container.append('<input type="radio" name="radio_group" value="' + i + '">');
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="radio_container">Choose one: </div>Thus you search for the container only once (unlike in the other answers) and assign a value to each radio that lets you identify the choice.
Comments
Assuming that you have a div with the ID=myDivContainer try this:
for (i=0;i<=20;i++)
{
$("#myDivContainer").append('<input type="radio" />')
}
1 Comment
Palec
The input doesn’t have all the required attributes.
for (var i=0;i<=20;i++)
{
$("#yourcontainer").append("<input type='radio' name='myRadio' />");
}
Comments
