How to initialize a datatables without columns

ebagaipo

hi,

How to initialize a datatables without columns?

colin

Hi @ebagaipo ,

There's an existential query - can a table be a table if it has no columns? I suspect a lot of the code makes the assumption that that's the case.

Cheers,

Colin

ebagaipo

The columns on my table are dynamic. So I need to initialize (I think this is a must?) datatables then get the columns and data then put to the datatables.

kthorngren

You would use columns.title to have Datatables create the columns. You can fetch thee column info from ajax. This example derives the column names from the field names of the first row of data. You could use a dedicated object to provide the column info.

http://live.datatables.net/huyexejo/1/edit

Kevin

ebagaipo

This is I get:

Expected the request to have a sEcho value greater than 0

        var urlData = '@Url.Action("GetFormMetadata", "FormMetadata")/?formMetadataConfigName=' + selectedFormMetadataConfigName;
        $.ajax({
            url: urlData,
            success: function (response) {
                if (response != null || response.length > 0 || response != undefined) {
                    $('#tblFormMetadata').DataTable({
                        "autoWidth": true,
                        "bProcessing": true,
                        "bServerSide": true,
                        "bLengthChange": false,
                        "bInfo": false,
                        "bPaginate": false,
                        "bSort": false,
                        "bDestroy": true,
                        "bFilter": false,
                        "scrollX": true,
                        "bSearchable": false,
                        "data": urlData,
                        "aoColumns": mDataArray
                    });
                }
            }
        });


    public JsonResult GetFormMetadata(DataTablesModel param, string formMetadataConfigName) 
    {
        var list = _db.ProcessFormMetaDatas.Where(a => a.Name == formMetadataConfigName).Select(x => new ProcessFormMetadataModel
        {
            Name = x.Name,
            Column1 = x.Column1,
            Column2 = x.Column2,
            Column3 = x.Column3,
            Column4 = x.Column4,
            Column5 = x.Column5,
            Column6 = x.Column6,
            Column7 = x.Column7,
            Column8 = x.Column8,
            Column9 = x.Column9,
            Column10 = x.Column10,
            Column11 = x.Column11,
            Column12 = x.Column12,
            Column13 = x.Column13,
            Column14 = x.Column14,
            Column15 = x.Column15,
            Column16 = x.Column16,
            Column17 = x.Column17,
            Column18 = x.Column18,
            Column19 = x.Column19,
            Column20 = x.Column20,
            Id = x.Id
        }).OrderBy(a => a.Id);

        int TotalRow = list.Count();
        var result = list.OrderBy(x => x.Name).ToList();
        return Json(new
        {
            iTotalRecords = TotalRow,
            iTotalDisplayRecords = TotalRow,
            aaData = result
        }, JsonRequestBehavior.AllowGet);
    }

kthorngren

The biggest issue is that with server side processing enabled you also need to use the ajax option. See this thread:
https://datatables.net/forums/discussion/comment/148524/#Comment_148524

My suggestion would be to use the jQuery ajax request to get the column info then in the success build the table headers followed by initializing Datatables with serversid eprocessing and with the ajax option. Or disable serverside processing.

Kevin

ebagaipo

I disabled serverside processing but no data display

ebagaipo

It is working now by setting serverside = false.

ebagaipo

It is working now by setting serverside = false with minor changes on my code.