checkboxes in datatables?

veloopity

my customer wants a new functionality that would allow him to choose certain data rows, for instance by adding a checkbox for each line (the table would have to be placed inside a form, and there would be a submit button somewhere). I haven't tried if that works yet - can it be done? even if paging is switched on? even if the table is fed by javascript?
Or could the choosing be done in another way?

-Michael

FrancYescO

you can.

what i have done for my server processed table...

            {"data": null, "render": function (data, type, full, meta) {
                    return '<input name="IDs[]" value="' + full.ID + '" type="checkbox" checked="checked"/>';
                }
            },

veloopity

thank you !!

veloopity

could someone please help me with the render function? I'm not much of a javascript expert and what I found in the discussions is way beyond my understanding.

My data come from a database of course, the page is generated with ColdFusion (think: PHP). The datatables are inside of a form. Each line has a checkbox whose name corresponds to the database row id. On submitting the form, the checked checkboxes are evaluated and used to create a new page with averages over the selected rows.

Here is a very simple datatables example page with static data. When I write it like this, checkboxes are displayed but they don't work - they aren't recognized as form elements. How would one do it?

(... and how does one format code here? when I choose 'code' it comes out like this - is there something like "pre"?)

<form>
<script type="text/javascript" class="init">
    var data = [
        ["1","row1","1"],
        ["2","row2","2"],
        ["3","row3","3"]
    ];
    $(document).ready(function() {
        $('#table_testlist').DataTable( {
            data: data,
            {
                "aTargets": [0],
                "mRender": function (data, type, full) {
                       return '<input type=\"checkbox\" name="chk' + data + '" value="1">';
                }
            },      
        } );
    } );
</script>
<table id="table_testlist" class="display datatable">
    <thead id="table_testlist_thead">
        <tr>
            <th>checkbox</th>
            <th>row</th>
            <th>value</th>
        </tr>
    </thead>
</table> 
</form>

Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

allan

(... and how does one format code here? when I choose 'code' it comes out like this - is there something like "pre"?)

Use a triple back tick. See the documentation here.

they aren't recognized as form elements

As in they aren't rendered as checkboxes? It looks okay to me from the above code (although your have redundant escaping about the double quotes for the type attribute's value).

I'd need a link to a test case showing the issue to understand the problem better.

Allan

veloopity

thx Allan no, they're looking like checkboxes but when I place the whole thing into a form, check some of the boxes, and send the form, they don't arrive on the target page.
Will try to set up a test case for you.

allan

You might be interested in this example.

Allan

veloopity

hi Allan, never mind. I just found that it was a problem with divs closing inside of the very complex form, apparently cutting off form fields that followed. Got it working now I think
Many thanks !!!!