Need Inline editor with date time, but the calendar only come with date i need time too. How to change?
Hi mughi,
If I understand you correctly, you want to change the configuration of the inline editor in the grid, like on the following screen
because the default configuration does not allow you to work for hours and minutes, am I right?
Unfortunately, we don’t have built-in settings for this, because gantt uses HTML5 <input type=“date”>,
which does not support the hours and minutes options.
HTML5 date : <input type="date"> HTML attribute value - HTML | MDN.
But you can use some user settings or third-party plugins, to create your own configuration
docs: Inline Editing in Grid | DHTMLX Gantt Docs (custom inline editing)
I made a little example, using jquery DateTimePicker, to show you, how to use third-party plugins with gantt inline editor: DHTMLX Snippets
I left some comments in code, to make it easier to understand.
jQuery DateTimePicker:
CDN: jquery-datetimepicker - Libraries - cdnjs - The #1 free and open source CDN built to make life easier for developers
docs: DateTimePicker jQuery Plugin — Date and Time Input
Of course, you could use another plugin that you want.
You can also avoid using third-party plugins by creating your own date format. To do this, you must change editor type to “text”(in order not to use the date editor built into the browser). And create the logic you want.
Like in the following snippet:
DHTMLX Snippets
This example is not the best way to do what you want and it is not ready for use in a real application, but it could show you a different way to work with inline editors.
Short video tutorial, about how to implement custom inline editing:
https://www.youtube.com/watch?v=0rIPrC0GtME
Also, you could use <input type=“datetime-local”>
docs: <input type="datetime-local"> HTML attribute value - HTML | MDN
Note, this option isn’t supported by IE/Edge so if you need a cross-browser solution then ‘local-time’ won’t work for you.