Select fieldtype with options provided by server

chris_n

After scouring the forum, I'm still not sure why this is not working for me.

What happens is that neither the select field nor the pull-down is populated in the editor, while the field in datatables is correct.

I have been attempting to follow this example: http://editor.datatables.net/examples/advanced/deepObjects.html only without the nested data. I handle the necessary joins on the backend. (The scripting is all done in Perl w/T::T fwiw).

Here is the data passed to the client by the server:

{
    "data": [
        {
            "date_created"  :   "2015-02-13 15:29:05",
            "date_received" :   "0000-00-00 00:00:00",
            "order_num"     :   "1",
            "received"      :   "0",
            "vendor_id"     :   "1",
            "date_placed"   :   "2015-02-13 15:29:05",
            "business_name" :   "Walmart",
            "notes"         :   "Test Order"
        }
    ],
    "options": {
        "vendor_id": [
            {"value":"1",       "label":"Walmart"},
            {"value":"2",       "label":"Sam's Club"},
            {"label":"SYSCO",   "value":"3"},
            {"value":"0",       "label":"In-House"}
        ]
    }
}

And the js:

var editor;
$(document).ready(function() {
    editor = new $.fn.dataTable.Editor( {
        "ajax"  : "../cgi-bin/ajax/table.orders.cgi",
        "table" : "#orders",
        "idSrc" : "order_num",
        "fields": [
            {
                "label" : "Order Number",
                "name"  : "order_num",
                "type"  : "readonly"
            },
            {
                "label" : "Date Created",
                "name"  : "date_created",
                "type"  : "text"
            },
            {
                "label" : "Vendor",
                "name"  : "vendor_id",
                "type"  : "select"
            },
            {
                "label" : "Date Placed",
                "name"  : "date_placed",
                "type"  : "text"
            },
            {
                "label" : "Date Received",
                "name"  : "date_received",
                "type"  : "text"
            },
            {
                "label" : "Notes",
                "name"  : "notes",
                "type"  : "text"
            },
            {
                "label" : "Received",
                "name"  : "received",
                "type"  : "text",
            }
        ]
    } );

    $('#orders').dataTable( {
        "dom"   : "Tfrtip",
        "ajax"  : {
            url     :   "../cgi-bin/ajax/table.orders.cgi",
            type    :   "POST"
        },
        "columns"   : [
            { "data"    : "order_num" },
            { "data"    : "date_created" },
            { "data"    : "business_name" },
            { "data"    : "date_placed" },
            { "data"    : "date_received" },
            { "data"    : "notes" },
            { "data"    : "received" }
        ],
        "tableTools"    : {
            "sRowSelect"    : "os",
            "aButtons"  : [
                { "sExtends"    : "editor_create", "editor" : editor },
                { "sExtends"    : "editor_edit",   "editor" : editor },
                { "sExtends"    : "editor_remove", "editor" : editor }
            ]
        }
    } );
} );

allan

Hi,

Can you confirm which version of Editor you are using? The options property will only work with Editor 1.4+.

You can which which version you are using by typing $.fn.dataTable.Editor.version into your browser's Javascript console.

Allan

chris_n

That fixed things right up.

Somehow I missed the fact that 1.4 was just released.

Thanks, Allan!