Unexpected value of "row" variable in column render

990consulting

I see that column render is well-trodden ground here on the discussions. Alas, I cannot resolve my confusion. My client side logic for a particular page is below. I am trying to build a custom-rendered column that passes the values of certain other columns as GET parameters in a hyperlink.

Following the example, I first tried using numerical indexes on row. When that didn't work, I looked on the forums and saw that I should be using the names of the columns as keys. But when I did that, I got very bizarre results.

My various attempts, and their baffling results, are at the end of the code as comments in the "columnDefs" key. What am I missing?

David

PS: I'm using the node.js implementation of the editor engine against a MySQL database.

var get_params = document.currentScript.getAttribute('get_params');
(function($){

    $(document).ready(function() {
        var editor = new $.fn.dataTable.Editor( {
            ajax: "/api/level_location",
            table: "#level_location",
            fields: [ {
                label: "Level:",
                name: "level_location.level_id",
                type: "select",
                placeholder: "Level"
            }, {
                label: "Earliest year:",
                name: "level_location.earliest_year"
            }, {
                label: "Latest year:",
                name: "level_location.latest_year"
            }, {
                label: "Confirmed:",
                name: "level_location.confirmed"
            }

            ]
        } );

        $('#level_location').DataTable( {
            dom: "Bfrtip",
            ajax: {
                url: "/api/level_location?" + get_params,
                type: 'POST'
            },
            columns: [
                { data: "level.name" },
                { data: "level_location.location" },
                { data: "level_location.earliest_year" },
                { data: "level_location.latest_year" },
                { data: "level_location.confirmed" },
                { data: "level_location.added" },
                { data: "level_location.modified" },
                { data: "notes" }
            ],
            select: true,
            buttons: [
                { extend: "create", editor: editor },
                { extend: "edit",   editor: editor },
                { extend: "remove", editor: editor }
            ],
            "columnDefs": [
                {
                    "render": function ( data, type, row ) {
                        //What I really want
                        //Resulting URL is http://dev.990consulting.com:8080/tbl/level_location_note?level=[object%20Object]&location=undefined
                        //return '<a href="level_location_note?level=' + row['level'] + '&location=' + row['location'] + '">Notes</a>';

                        //Returns undefined
                        //return row[0]

                        //Returns "name" -- why?
                        //return Object.keys(row["level"]);

                        //Returns "DT_RowId,level_location,level,notes". Where are the other fields?
                        return Object.keys(row);

                    },
                    "targets": 7
                }
            ]

        } );
    } );
}(jQuery));

kthorngren

You have:

<a href="level_location_note?level=' + row['level'] + '&location=' + row['location'] + '">Notes</a>';

I'm not totally clear on how you want the URL but this is my guess:

<a href="level_location_note?level=' + row.level.name + '&location=' + row.level_location.location + '">Notes</a>';

You can use console.log(row); within columns.render to see your data for each row. The structure of the row object is the same as outlined in your columns data config. If you want to get the name then use row.level.name.

HTH,
Kevin

990consulting

You nailed it. I see now that if you qualify your field name with a table name for the database, you will get back a nested object with row.table.field. Thank you.