Menu
I have a table which contains a radio button in every row. I am calling a JavaScript function onclick event on radio button like this
<input type="radio" id="rdbSelect" name="Select" onclick="MyFunction()" />
But when I press Down/Up arrow in keyboard, focus goes to Next/Previous radio button function calls again.
I want that function to be called only when radio button is clicked by mouse, not on focus.
Here is my Code
HTML
<div style="width:400px">
<table class="style1" id="Table1">
<tr>
<td>
<input type="text" id="text1" />
</td>
<td>
<input type="text" id="text2" />
</td>
<td>
<input type="radio" id="rdbSelect" name="Select" onclick="Test()" />
</td>
</tr>
</table>
</div>
and JavaScript
function CreateGrid() {
var Grid = document.getElementById('Table1')
for (var i = 1; i < 6; i++) {
var newrow = Grid.rows[Grid.rows.length - 1].cloneNode(true);
newrow.cells[0].innerText;
newrow.cells[1].children[0].value = '';
newrow.cells[2].children[0].value = '';
Grid.getElementsByTagName('tbody')[0].appendChild(newrow);
}
}
function Test() {
alert("Hello");
}
Any help will be appreciated.
500
Check the answer posted here:
https://stackoverflow.com/a/33400670/3780922
It details all the cross-browser problems associated with handling click/change events, and walks through where the mouse-event trick (as shown below) fails.
Focus is a tough problem, because once the radio group (all radios with the same name) is focused, the arrow keys will change the value, which fires the change event AND the click event, which is done via the browser for compatibility with keyboard navigation.
a simple but non-cross-browser solution is as follows:
$('input[name="radioButton"]').on("click", function(e) {
if (e.clientX === 0 && e.clientY === 0) {
console.log("keyboard");
} else {
console.log("mouse");
};
}
you try this
<input type="radio" name="rd1" id="red" onchange="myFunction()">select
for ex:-
<html>
<body>
<input type="radio" name="rd1" id="red" onchange="myFunction()">select<br>
<script>
function myFunction() {
alert("radio selected");
}
</script>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
