Q:

Pass in Metadata to HTML Table

I have a List of Personnel objects that I have created, each with 11 attributes. I want 9 of the attributes to be displayed in an HTML table, and the other 2 to be used as metadata (deciding which columns to make editable etc.). So, I create a JSON with the list of data to be displayed:
var jjData = from d in jData select new {
                                            DT_RowId = d.Id,              
                                            A = d.A,
                                            B = d.B,
                                            C = d.C,
                                            D = d.D,
                                            E = d.E,
                                            F = d.F,
                                            G = d.G,
                                            H = d.H,
                                            I = d.I,
                                            J = d.J,
                                            K = d.K,    // metadata
                                            L = d.L     // metadata
                                        };

Then jjData is passed into a JSON constructor. How do I let the table know in HTML/JavaScript that I only want 9 of the columns to be displayed? I have: 
oTable = $("#personnelList").dataTable(
            {
                // other things 

                aoColumns: [
                { sTitle: "A", mDataProp: "A", sType: "string" },
                { sTitle: "B", mDataProp: "B", sType: "string" },
                { sTitle: "C", mDataProp: "C", sType: "string" },
                { sTitle: "D", mDataProp: "D", sType: "string" },
                { sTitle: "E", mDataProp: "E", sType: "string" },
                { sTitle: "F", mDataProp: "F", sType: "string" },
                { sTitle: "G", mDataProp: "G", sType: "string" },
                { sTitle: "H", mDataProp: "H", sType: "string" },
                { sTitle: "I", mDataProp: "I", sType: "string"},
                { sTitle: "J", mDataProp: "J", sType: "string" },
                { mDataProp: "K", sType: "string", display: "none" },
                { mDataProp: "L", sType: "string", display: "none" },
                ]

K and L are the metadata columns. But like this, they still show up, simply as columns without titles. What other way can I tell the table to ignore those two columns?

A:

Replace the [invalid] display: "none" with the sClass parameter.
oTable = $("#personnelList").dataTable({
    // other things 
    "aoColumns": [
        { "sTitle": "A", "mDataProp": "A", "sType": "string" },
        { "sTitle": "B", "mDataProp": "B", "sType": "string" },
        { "sTitle": "C", "mDataProp": "C", "sType": "string" },
        { "sTitle": "D", "mDataProp": "D", "sType": "string" },
        { "sTitle": "E", "mDataProp": "E", "sType": "string" },
        { "sTitle": "F", "mDataProp": "F", "sType": "string" },
        { "sTitle": "G", "mDataProp": "G", "sType": "string" },
        { "sTitle": "H", "mDataProp": "H", "sType": "string" },
        { "sTitle": "I", "mDataProp": "I", "sType": "string"},
        { "sTitle": "J", "mDataProp": "J", "sType": "string" },
        { "mDataProp": "K", "sType": "string", "sClass": "ui-helper-hidden" },
        { "mDataProp": "L", "sType": "string", "sClass": "ui-helper-hidden" }
    ]
});

Set a value for the sClass parameter with a class that has display: none; defined for it.
.ui-helper-hidden {
    display: none;
}

See: http://datatables.net/usage/columns

