Clever Geek Handbook

Finding a workaround as radioobutton.click () hangs in Safari but works in Chrome

I have a table with some checkboxes in it and I added this code so that when you click on any part of certain table cells the checkbox is checked. When the checkbox is checked, I need to remove the class disabled

using a button so the user can proceed to the next step.

This code works fine in Chrome, but in Safari it hangs the window immediately after being called $('input:radio', $parent).click()

.

Is there a better way to do this?

$('td.info, td.control').click(function() {
  var $parent;
  $parent = $(this).parent();
  $('input:radio', $parent).attr('checked', true);
  return $('input:radio', $parent).click();
});
$("input[name='package[order_option_id]']").click(function() {
  return ($("#select-interaction-link")).removeClass('disabled');
});
+3


source to share


3 answers


I think the reason for the hang is because you are calling an infinite loop. When the code clicks on the radio button, the click bubbles up to the containing one td

, which causes your handler click()

to run again.

I think you can solve this with:



$("td.info input:radio, td.control input.radio").click(function(e) {
    e.stopPropagation();
}
+5


source


Try without using context:



$('td.info, td.control').click(function() {
    return $(this).parent().find('input[type=radio]').attr('checked', true).click();
});
0


source


I don't know if this affects Safari, but if you want to check the radio, change this

$('input:radio', $parent).attr('checked', true);

to that

$('input:radio', $parent).prop('checked', true); // Uses the js property value

or

$('input:radio', $parent).attr('checked', 'checked'); // Uses the attribute

Also remember that events are bubbling ... not sure if you could create some kind of loop by explicitly naming the radio click function here, but I would go through it with Safari and make sure it doesn't. Just paranoia.

0


source






More articles:


All Articles