Datetime picker plug-in code

MattD

Hi,

This may be a silly question, but where does the plug in code for the datetime picker go? The plug-in is working to an extent, but if I put the plug in code in the js file for my table, it displays the calendar at the end of the table and nothing when I click on the field which is supposed to be datetime in the edit modal form.

Thanks!

allan

The load order should be something like this:

1. jQuery
2. DataTables
3. TableTools (if you are using it)
4. Editor
5. Plug-ins
6. Your initialisation code

If that doesn't fix it, could you link me to the page so I can take a look?

Thanks,
Allan

MattD

Below is a Generator based version of the page. The only thing added is the datetimepicker. I've tried the plugin code everywhere in "js/table.location_schedule.js" as well as in the html below the javascript file loads. It always results in the calendar either where it is now, or the table not loading. As a side note, the default datepicker calendar packaged with editor works fine.

http://tinyurl.com/p33xvpb

Thanks in advance!

allan

There is something funny going on with the CSS there!

Try adding this to your CSS:

.datetimepicker {
  position: absolute;
  background: white;
  border: 1px solid #ddd;
}

Allan

MattD

The calendar is now styled and it pops up in the date selection, however it is still showing on the table page and the bar for the data selection extends further than the modal window. You will see what I mean.

MattD

I switched to the Bootstrap DateTimePicker(2) which links to this https://github.com/Eonasdan/bootstrap-datetimepicker and it works. Though there is some confusion because on the plugin page, it states that it requires the one linked in Bootstrap DateTimePicker(1).

Are we able to use the options which don't go into the opts field, such as custom date formatting seen here http://eonasdan.github.io/bootstrap-datetimepicker/#example5?

If this isn't available with this particular plugin, I can use the DatePicker for the date however I would still like to be able to get a 24 hour clock if possible.

http://tinyurl.com/p33xvpb

Thanks!

allan

Sorry for the long delay on this one. I've sorted out the links now - thanks for pointing that out.

I've also added an attr option to the plug-in which can be used to set the data attributes. For example:

   type: 'datetime',
   attr: {
      "data-date-format": "YYYY-MM-DD"
   }

Regards,
Allan