How to avoid multiple radio buttons selection when paginating a data table

Question

I'm having a problem here: When I select a radion button in a page 1 and another one in the same page it works fine, but when I select a radio button in the page number 2, and go back to the page number 1, that first radio button still selected and the one in the page number 2 is also selected, how can I solve this problem? I was looking for a solution here in the forum but couldn't find someone with the same problem.

*[code] $(document).ready(function () { var oTable = $('#example').dataTable({ "bJQueryUI": true, "sPaginationType": "full_numbers" }); }); [/code]*

Answer 1

There is no solution from DataTables itself. You'll have to do it on your own.

What you can do is save the selected value yourself on a click. Imagine you have a table called projectsTable. Then you can write:

var selection = -1;
$("#projectsTable input[type=radio]").on
(
    "click",
    function()
    {
          selection = $(this).val();
    }
);

Then, you'll have to unselect all the wrong values every time the page changes. Add a callback in the construction of your table for page draw to do that:

//other settings go here, like the dom one
//you can choose your own, no need for this specific one
"dom": "lfBrtip",
"fnDrawCallback":
function(oSettings)
{
     $("#projectsTable input[type=radio][value!="+selection+"]").prop('checked', false);
}

Every time the page is changed, this piece of code deselects everything you don't want to be selected any longer.