Converting a table over to a datatable can deselect any radio buttons in the first row of the table

Converting a table over to a datatable can deselect any radio buttons in the first row of the table

kinshokinsho Posts: 1Questions: 0Answers: 0
edited March 2013 in Bug reports
We're using DataTables 1.9.4 here...

The bug surfaced when we were trying to convert a table that contains radio buttons on each row. If the first row contains a radio button that has a name attribute and that's selected prior to conversion to a DataTable, that radio button will be deselected following conversion. After some time spent debugging, I figured out what's going on. The issue is with line 3681 of the main library:

function _fnCalculateColumnWidths ( oSettings )
nWrapper.appendChild( nCalcTmp );

I understand what you're doing here is essentially setting up a pseudo-clone (nCalcTmp) of the table that we are converting so that you can calculate the appropriate widths for each table column before you actually convert the table. I say pseudo-clone because I see that nCalcTmp only contains the first row from the original table. All the other rows are discarded.

So the issue here is if that table's first row contains a radio button with a name attribute that's currently selected. In that case, when we clone the table and put it into the DOM tree, we'll end up having two radio buttons with the same name value, both of which should be selected. However, the browser will not tolerate that. So it deselects the radio button from the original table instead to abide by the fact that if multiple radio buttons share the same name value, only one can be selected at any one time. Unfortunately, the radio button remains deselected in the original table, even after conversion.

I recommend the fix here should be that before you append nCalcTmp to the DOM tree, go through the cloned table looking for any input elements. If you find any input elements, set their name attribute to undefined. That should resolve the issue.

If you're not fully sure what I'm talking about here, feel free to reply back saying so and I'll whip up a quick JSFiddle showing exactly what the issue is.



  • usmanghani599usmanghani599 Posts: 1Questions: 0Answers: 0
    I have radio button buttons in each row. And the radio button in first row become empty every time. I used following:
    //code of radio button
    checked="checked"<?php } ?>
    class="<?php if($patent['Patent']['review_1']=='1'){ ?>checked<?php } ?>"
    id="<?php echo $patent['Patent']['id']?>">Yes
    checked="checked"<?php } ?> class="<?php if($patent['Patent']['review_1']=='0'){ ?>checked<?php } ?>" id="<?php echo $patent['Patent']['id']?>">No

    // code for datatable jquery
    "fnDrawCallback": function() {
    $('.checked input:radio:checked').attr("checked","checked");
    But it is not solving the problem please help me with jsfiddle. thanks
This discussion has been closed.