This is short part of my code which display radio buttons.
<table width="100%">
<tr>
<td style="text-align:center">
<input type="radio" name="ah" value="" id="ah" align="left" checked="checked" />AH
</td>
<td style="text-align:center">
<input type="radio" name="esp" value="none" id="esp" align="right"/>ESP
</td>
</tr>
</table>
The problem is that the one radio button (AH) is by default checked as mentioned here and when i click on other radio button it also gets checked
but now both are checked how would I disable them.
I think it should happen automatically when I click on one radio button other button should be disabled automatically.
please correct me where am I wrong???
To group radio buttons together, they should share the same name:
<table width="100%">
<tr>
<td style="text-align:center">
<input type="radio" name="someName" value="AH" id="ah" align="left" checked="checked" />AH
</td>
<td style="text-align:center">
<input type="radio" name="someName" value="ESP" id="esp" align="right"/>ESP
</td>
</tr>
</table>
You need to give both radio buttons the same name attribute so the browser can recognize them as being in the same group.
They need to have the same name attribute.
try this it will help.... you have to give the same name to both radio button
<table width="100%">
<tr>
<td style="text-align:center">
<input type="radio" name="esp" value="" id="ah" align="left" checked="checked" />AH
</td>
<td style="text-align:center">
<input type="radio" name="esp" value="none" id="esp" align="right"/>ESP
</td>
</tr>
</table>
Related
I'm wondering if possible to arrange two checkbox input fields vertically in same td cell? Below is example, there both of input fields are next to each other.
<table>
<tr>
<td>
<input type="number" />
<input type="checkbox" name="ck1" id="ck1">A
<input type="checkbox" name="ck2" id="ck2">B
</td>
</tr>
</table>
How about using a simple <br> with using text-align:right on the <td>?
<table>
<tr>
<td style='text-align:right'>
<input type="number">
<input type="checkbox" name="ck1" id="ck1">A<br>
<input type="checkbox" name="ck2" id="ck2">B
</td>
</tr>
</table>
i'm trying to get the texts (answers) next to the radiobuttons, to compare them with the correct answer.
Here is the html part:
<tbody>
<tr>
<td class="middle" width="15">
<input name="multiple_choice_result" value="0" id="0" type="radio">
</td>
<td class="middle">
<label for="0">FIRST ANSWER</label> // This text
</td>
</tr>
<tr>
<td class="middle" width="15">
<input name="multiple_choice_result" value="1" id="1" type="radio">
</td>
<td class="middle">
<label for="1">SECOND ANSWER</label> //This text
</td>
</tr>
<tr>
<td class="middle" width="15">
<input name="multiple_choice_result" value="2" id="2" type="radio">
</td>
<td class="middle">
<label for="2">THIRD ANSWER</label> //This text
</td>
</tr>
</tbody>
Use below Xpath:-
//label[contains(.,'ANSWER')]
Note:- Above xpath will return 3 elements so I am using List
List<WebElement> allanswer = driver.findElements(By.xpath("//label[contains(.,'ANSWER')]"));
for(WebElement answer: allanswer){
System.out.println(answer.getText());
}
If you want any particular answer then use:-
//label[contains(.,'FIRST ANSWER')]
Replace FIRST with SECOND OR THIRD according to your need
String answer =driver.findElement(By.xpath("//label[contains(.,'FIRST ANSWER')]")).getText();
Hope it will help you :)
This seems (and should be) simple, but I have no idea why the values for my radio buttons appear empty
<!DOCTYPE html>
<html>
<body>
<form method="post" action="action_page.php">
<table>
<tr>
<th>Intermediate</th><th>Advanced</th><th>No selection</th>
</tr>
<tr>
<td colspan="3">
<label for="td1">1. Bash</label>
</td>
</tr>
<tr>
<td>
<input type="radio" name="td1" id="td1" value="BashInter"/>
</td>
<td><input type="radio" name="td1" value="BashAdv"/>
</td>
<td><input type="radio" name="td1" value="" /></td>
</tr><tr>
<td colspan="3">
<label for="td1">2. C</label>
</td>
</tr>
<tr>
<td>
<input type="radio" name="td2" id="td2" value="CInter"/>
</td>
<td><input type="radio" name="td2" value="CAdv"/>
</td>
<td><input type="radio" name="td2" value="" /></td>
</tr><tr>
<td colspan="3">
<label for="td1">3. C++</label>
</td>
</tr>
<tr>
<td>
<input type="radio" name="td3" id="td3" value="C++Inter"/>
</td>
<td><input type="radio" name="td3" value="C++Adv"/>
</td>
<td><input type="radio" name="td3" value="" /></td>
</tr></table>
<input type="submit" value="Submit">
</form>
<p>If you click "Submit", the form-data will be sent to a page called "action_page.php".</p>
</body>
</html>
If run on W3Schools' (ugh) server, it correctly outputs the input.
e.g.
td1=BashInter&td2=CAdv&td3=
However, my server, for print_r($_POST); returns
[td1] => [td2] => [td3] =>
regardless of what is selected.
Looking at the HTTP headers confirms that nothing is being sent.
All other aspects of the form correctly send their values.
I have tried a number of variants in relation to the values, but nothing has altered the fact that no data actually appears to be sent by the radio buttons.
You didn't specified that your form must be send as a POST one, so used method is defaulted to GET.
Try with
<form action="action_page.php" method="POST">
Last radio button of every set has been kept empty and has black value.
Which means <input type="radio" name="td3" value="" /> needs to be replaced with <input type="radio" name="td3" value="Some value 3" />
So in case you are selecting last radio button from every set then obviously it wont return anything.
Apart from this there is not other problem as long as your HTML code is concerned. If you still face any problem please upload your PHP code as well.
I also suggest to give some some meaningful label to each radio.
Here is the code you may try
<!DOCTYPE html>
<html>
<body>
<form method="POST" action="action_page.php">
<table>
<tr>
<th>Intermediate</th><th>Advanced</th><th>No selection</th>
</tr>
<tr>
<td colspan="3">
<label for="td1">1. Bash</label>
</td>
</tr>
<tr>
<td>
<input type="radio" name="td1" id="td1" value="BashInter"/> BashInter
</td>
<td><input type="radio" name="td1" value="BashAdv"/> BashAdv
</td>
<td><input type="radio" name="td1" value="Some value 1" /> Some value 1</td>
</tr><tr>
<td colspan="3">
<label for="td1">2. C</label>
</td>
</tr>
<tr>
<td>
<input type="radio" name="td2" id="td2" value="CInter"/> CInter
</td>
<td><input type="radio" name="td2" value="CAdv"/> CAdv
</td>
<td><input type="radio" name="td2" value="Some value 2" /> Some value 2</td>
</tr><tr>
<td colspan="3">
<label for="td1">3. C++</label>
</td>
</tr>
<tr>
<td>
<input type="radio" name="td3" id="td3" value="C++Inter"/> C++Inter
</td>
<td><input type="radio" name="td3" value="C++Adv"/> C++Adv
</td>
<td><input type="radio" name="td3" value="Some value 3" /> Some value 3</td>
</tr></table>
<input type="submit" value="Submit">
</form>
<p>If you click "Submit", the form-data will be sent to a page called "action_page.php".</p>
</body>
</html>
I have a div ,and inside div there is radio buttons, what is the easiest way to align radio button according to text vertically in same line inside div
echo"<div id=\"div{$id}\" ";?>
echo"</br>
<input type= radio name=\"{$id}\" value=\"{$option1}\" >
$option1
</br>
<input type= radio name=\"{$id}\" value=\"{$option2}\">
$option2
</br>
<input type= radio name=\"{$id}\" value=\"{$option3}\">
$option3
</br>
<input type= radio name=\"{$id}\" value=\"{$option4}\">
$option4
</br></br>";
echo"</div>";
in above code values are taken from db, I want to know how to align radiobuttons inside div vertically in same line.
Style radio buttons like this:
input[type="radio"] {
margin-top: 0;
vertical-align: middle;
}
You could try it with a table:
echo"<div id=\"div{$id}\" ";?>
echo"<br />
<table>
<tr>
<td>
<input type= radio name=\"{$id}\" value=\"{$option1}\" >
</td>
<td>
$option1
</td>
</tr>
<tr>
<td>
<input type= radio name=\"{$id}\" value=\"{$option2}\" >
</td>
<td>
$option2
</td>
</tr>
<tr>
<td>
<input type= radio name=\"{$id}\" value=\"{$option3}\" >
</td>
<td>
$option3
</td>
</tr>
<tr>
<td>
<input type= radio name=\"{$id}\" value=\"{$option4}\" >
</td>
<td>
$option4
</td>
</tr>
</table>
</br></br>";
echo"</div>";
you will have to put them in the table for proper alignment...
echo"<div id=\"div{$id}\" ";?>
echo"</br>
<table><tr>
<td align=cente valign=middle><input type= radio name=\"{$id}\" value=\"{$option1}\" ></td><td align=center valign=middle>
$option1</td></tr>
<td align=cente valign=middle><input type= radio name=\"{$id}\" value=\"{$option2}\"></td></td><td align=center valign=middle>
$option2</td></tr>
</br>
<td align=cente valign=middle><input type= radio name=\"{$id}\" value=\"{$option3}\"></td><td align=center valign=middle>
$option3</td></tr>
</br>
<td align=cente valign=middle><input type= radio name=\"{$id}\" value=\"{$option4}\"></td><td align=center valign=middle>
$option4</td></tr>
";
echo"";
I have two radio buttons what I want is that when I select one of them then a drop down list should appear and when other one is marked then drop down list should disappear and instead of it a text message should be displayed.
The code for this part is as follows --
<head>
<script type="text/javascript">
function showhide(r){
var t=r.form['mode'];
if (r.value=='none') {
t.setAttribute('disabled','disabled');
document.getElementById('data').innerHTML="option not supported";
}
else {
t.removeAttribute('disabled');
}
t.style.display=r.value;
}
</script>
</head>
<body>
<table>
<tr>
<td width="400" height="40">Protocol</td>
<td>
<table width="100%" name="table">
<tr>
<td style="text-align:center">
<input type="radio" name="protocol" value="" id="opt1" align="left" checked="checked" onclick="showhide(this)" />opt1
</td>
<td style="text-align:center">
<input type="radio" name="protocol" value="none" id="opt2" align="right" onclick="showhide(this)"/>opt2
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="400" height="40">Mode of Operation</td>
<td id="data">
<select name="mode" id="mode">
<option value="opt1">TCP</option>
<option value="opt2">UDP</option>
</select>
</td>
</tr>
</table>
</bdoy>
Now the text message ("option not supported") is displayed once and then it doesn't disappear when switching between the radio buttons and so drop down list doesn't appear again.Where am i getting wrong?? If possible make correction in the code.
Please correct me..
<td name="data">
must be
<td id="data">