samedi 30 avril 2016

Function to change checkboxes not working on dynamically created table

I have a table that each row has three checkboxes, what I am trying to do is have it so only one checkbox can be selected per row. If a checkbox is checked, the other checkboxes will be unchecked. The code that I currently have is the following:

$('#idCheckboxOne').on 'change', ->
  if $('#idCheckboxOne').prop('checked')
    $('#idCheckboxTwo').prop 'checked', false
    $('#idCheckboxThree').prop 'checked', false

$('#idCheckboxTwo').on 'change', ->
  if $('#idCheckboxTwo').prop('checked')
    $('#idCheckboxOne').prop 'checked', false
    $('#idCheckboxThree').prop 'checked', false

$('#idCheckboxThree').on 'change', ->
  if $('#idCheckboxThree').prop('checked')
    $('#idCheckboxTwo').prop 'checked', false
    $('#idCheckboxOne').prop 'checked', false

So this code will work on the first row of my table, but not any other row. I know that part of my problem is that Im using the function by the checkbox's ids, so since each table row has the same checkboxes, the ids are not unique for the other table rows. So my question is what is the best approad for having the above functionality for each table row?




Aucun commentaire:

Enregistrer un commentaire