jQuery, DataTables, column with editable Date for data obtained from server

Question

aoColumns property offers possibility for setting type of columns rendering in table using DataTable .

There are no problem if the type is textarea , select but how can I set type for ' Date ' for showing properly date value and edit it in special editor for date valuse like datepicker.

I use for testing and knowledge example from link below:

http://www.script-tutorials.com/datatables-data-from-ajax-edit-in-place/

because remote editing database table is one of my needs.

Small part of code I want to use and improve is here:

  'aoColumns': [
        {
             type:'textarea',
        },
        {
            type: 'select',
            data: "{'1':'true','0':'false'}",
            submit: 'Ok',
        },
        {
            type: 'date' //********* here is my problem
        },

    ]

Answer 1

If you aren't using or n't prefering to use any third party plugin, then try Rendering it as simple textbox and apply a class to the column where you are trying to apply the datepicker

'aoColumns': [
        {
            sClass: 'dateField' 
        }
    ]

Use simple jquery to make it a datepicker as below :

$(document).on("focus",".dateField",function(){
    if ($(this).is("input[type=text]")) {
                  $(this).datepicker();
    }
});

If you prefer any other settings in datepicker then you can go through Jquery Datepicker and can simply apply the settings accordingly as normal jquery datepicker.

Hope this helps :)