Reputation: 41929
I'm borrowing/adapting this simple html/javascript form set up to put some data in the database. The original code uses text fields in the form, but I'm using radio buttons. The first three steps below are the original, and my question comes after...namely, do I give the radio buttons the same id...Hope this is clear...
Step 1. User enters value into form with id "nick"
<tr>
<td><label>User</label></td>
<td><input class="text user" id="nick" type="text" MAXLENGTH="25" /></td>
</tr>
Step 2. Value associated with id "nick" assigned to variable using id
var inputUser = $("#nick");
Step 3. getting the value from the variable for insertion into database...
if(inputUser.attr("value")
but if it's two "radio buttons" rather than one "text" field....
<td><label>Interview</label></td>
<td><input type="radio" name="interview" id="nick" value="pass" />Pass</td>
<td><input type="radio" name="interview" id="nick" value="fail" /> Fail</td>
Do I give the radio buttons the same "id" so that it's still like this when I assign the value to the variable...
var inputUser = $("#nick");
so that whichever button is checked will be assigned found in the id "nick"?
Upvotes: 19
Views: 70089
Reputation: 1
Its working for me, i have used same id health in 2 inputs.
var health =$('input:radio[id=health]:checked').val();
Upvotes: 0
Reputation: 3058
If want to use pure javascript you have to use..
document.querySelector('input[name=radio_btn_name]');
but it need updated browser. Old browsers may result incorrect.
To overcome this issue, javascript library is to use (library will handle the issue). For this use the following..
$('input[name=radio_btn_name]:checked').val();
Upvotes: 2
Reputation: 5533
ID Attribute is unique across the page. You should have different Ids for each radio button. Use below code to get the input value.
var inputUser=$('input:radio[name=interview]:checked').val();
Upvotes: 4
Reputation: 150030
Since you are using jQuery you can easily get the value of the selected radio button by using the :checked selector:
$("input[name=interview]:checked").val()
You should definitely not give more than one element the same ID (that's invalid HTML and will lead to confusing bugs in your JavaScript), but even if that worked it wouldn't help in this case since radio buttons as a group don't have a selected value: you need to determine which one is currently checked and then get its value as shown above. (This is not a problem when getting the value on the webserver when the form is actually submitted, because only the value from the checked radio gets submitted.)
Note also that in your original code where you said inputUser.attr("value")
, you could've said inputUser.val()
.
Upvotes: 15
Reputation: 2348
Do not repeat id's.It is best practice to use only one id per page as it must be unique.You can group the radio buttons using name attribute.
use $('input[name=interview]')
to get the value.
Upvotes: 1
Reputation: 15642
No, an Id attribute should always be unique. If you're using jQuery (looks like you are), you can select it with $('input[name=interview]');
.
Upvotes: 24
Reputation: 70075
The id
assigned to an element must be unique within the document. So, no, you should not use the same id
.
Upvotes: 0
Reputation: 54022
you must assign same name but different id to input type=radio
because this is basic property of raido button that you need to select only one value from givel aal radio buttons.
but that id should not be assigned to other form elements
Upvotes: 0