Eonasdan Bootstrap Datetimepicker

btree

Hi,

just want to share my custom plugin for eonasdan bootstrap datetimepicker. Backgroundinfo: My customers can choose between two date formats and I like the bootstrap more than the jquery.

Custom Field Type Code:

// Custom Field Type for Datatables Form
(function ($, DataTable) {

if ( ! DataTable.ext.editorFields ) {
    DataTable.ext.editorFields = {};
}

var Editor = DataTable.Editor;
var _fieldTypes = DataTable.ext.editorFields;

_fieldTypes.customdate = {
    create: function ( conf ) {
        var that = this;
        // Create the elements to use for the input
        conf._input = $( 
            '<div id="datetimepicker1" class="input-group date">'+
            '<input id="date" name="date" type="text" class="form-control">'+
            '<span class="input-group-addon">'+
            '<span class="fa fa-calendar"></span>'+
            '</span>'+
            '</div>')[0];
        return conf._input;
    },

    get: function ( conf ) {
        return $('#date', conf._input).val();  //return the field value POST
    },
    set: function ( conf, val ) {
        $('#date', conf._input).val(val);  //set the field value from movedate.date response
    },


};

})(jQuery, jQuery.fn.dataTable);

Field Code:

{
            id: 'datetimepicker1',
            label: i18n.gettext("Movedate:"),
            name: 'movedate.date',
            def:  moment().format(dateformat),
            type: 'customdate'
}

Datepicker Code:

function simple_datepicker(e){
$('#datetimepicker1').datetimepicker({
        format: dateformat,
                locale: lang,
        useCurrent: true,
        defaultDate: moment()       
    });
}

Hook Up Code:

editor.on('open', function(e, type){
    simple_datepicker();
})

Cheers
Hannes

allan

Hi Hannes,

Absolutely brilliant - thanks for sharing this with us!

Regards,
Allan