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: HyperText Markup Language | MDN.
But you can use some user settings or third-party plugins, to create your own configuration
docs: Inline Editing in Grid 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: https://cdnjs.com/libraries/jquery-datetimepicker
docs: DateTimePicker
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:
How to Implement Inline Editing in the Grid of a JavaScript Gantt Chart - DHTMLX Tutorial - YouTube
Also, you could use <input type=“datetime-local”>
docs: <input type="datetime-local"> - HTML: HyperText Markup Language | 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.