Skip to content

New Gantt Editor Release: The Best Ever!

April 5, 2017

It’s been a long time since I last published on this blog, I was very busy on building our  Twproject Project Management Software better and better. We have just released version 6.2 with a new mobile interface… but I’ll be back on this in one of my future posts.

During the last two years we have collected several feedback from our customers, but improvements and fixes were made on the Twproject’s Commercial Gantt editor version only.

The commercial version has been always a step forward the open source one, so after two and half years the gap becomes unbridgeable and I needed time and funds to ferry the open source component to the new world 🙂

Thanks to WikiSuite, that funded the alignment, the new version has finally seen the light.

Twproject’s Free Gantt Editor has been completely redesigned, the look and feel has been improved and usability has been improved.

There is also a lot of work under the hood. In order to fix several “strange” issues on complex Gantt cases, in fact, we have included a sort of unit testing engine (see ganttTestSuite.js) that helped us identifying and fixing issues.

..and some other changes…

We have added new columns on the grid: progress and milestones.

Collapsed tasks’ status is stored as well as the column’s size. Double click on columns will give the best fitting size.

Task delete, indent, outdent, up, down are now available using the keyboard too; that speeds-up the project editing.

Several new permissions have been added to let jQuery Gantt editor working better on real environments.

Last but not least, the Gantt editor works fine with jQuery 3.1.

20 Comments leave one →
  1. babyss permalink
    April 9, 2017 09:21

    Super this new version.
    Thank you for all this work.
    Unless I am mistaken, I have found that if a task lasts 1 day, it can not be enlarged on the fly …

  2. Nishant permalink
    April 25, 2017 10:53

    Can you provide duration entry in decimals. e.g. 10.5 days. Currently it is rounding the duration.

  3. May 6, 2017 20:24

    It is possible to have a javascrip function trigered when the user changes dates on a task?

    • May 8, 2017 07:20

      not exactly, but
      there is the event “saveRequired.gantt” that is triggered when something changes and the event “addedTask.gantt” when a task is added.

      • May 8, 2017 11:51

        Many thanks.

        It would be great to have property to get only the changed data, to speed save operations.

        In Safari 10.1, the demo gantt.html seems to have the columns on left panel with some problem on the headers. Columns widths are not the same as rows inside that panel.


  4. May 9, 2017 20:57

    Thank you, this is a great solution. Is there a simple way to modify the application to only use a single resource per task?

    • May 9, 2017 22:41

      Hi Joe,
      yes, it should be quite easy, check the full editor composition and remove the add button and reduce the number of empty rows.

  5. Sergey permalink
    June 19, 2017 11:05

    Hello, Roberto!
    I’m Sergey from Siberia.
    Thank you very much for your work!
    I’m working with jQuery Gantt and have some trouble with https. There is void page in demo and in my test chart when https is on. Can jQuery Gantt working with https?

    • June 19, 2017 12:35

      Yes, it works perfectly with https.
      Try it here:

      • Sergey permalink
        June 19, 2017 15:34

        Excuse me please. This solved. Its because of jquery.min.js and jquery-ui.min.js which loading with http (in your demo from github). And the browser blocks an unprotected connections.

  6. August 25, 2017 13:57

    Hi Roberto, great work! I’m a bit confused as to how start date, end date and duration work together. In my case I want to define tasks purely (or mostly) based on start and end date. However if I leave duration blank, it defaults to 1 and overrides the end date. I can’t calculate duration in advance however by simply going end-start, because of the weekends etc. Any ideas?

    • September 26, 2017 08:41

      Hi Michael,
      start, end and duration seem a mess, and actually they are 🙂
      Start and end point to the corresponding millisecond, but cannot define the duration (in working days) because of sat, sun and holidays.
      The component always recompute the end (and sometime the start too) considering duration and calendar; moreover dates are always changed to the first and last millis of the day.
      So the end date is useless when loading the project but it is very useful when you save the project, because you can use it for db searches.

      There is are a couple of functions added to the Date object:

      that take cares about working days.

  7. Frederik permalink
    September 18, 2017 19:13

    Hi Roberto,

    thank you for sharing this great gantt editor!

    If I plan a project in the future (a few month, January 2018 for example) the gantt chart starts always one week before today. There are a lot of empty weeks. Is there a simple solution to let it start with the project?

    Thank you in advance.


    • September 26, 2017 08:31

      By default jQuery Gantt tries to show today.
      If you want, you can swith off this feature modifying ganttDrawerSVG.js
      this.includeToday = false;

  8. Eduardo Sanjurjo permalink
    September 25, 2017 16:56

    Hello Roberto,
    Congratulations for your great software.
    Is there any example loading dynamic data from json, csv or MySQL?
    Thank you for your support.

  9. November 28, 2017 10:39

    Looks really good ,but I have a question about your JSON data,are there any fields can find its parent or child tasks???

    • November 28, 2017 15:03

      Following the MSP data schema, the parent-child relationship is given by the row index and the level.

      “parent”, row=0, level=0
      “child” , row=1, level=1

      The Gantt editor uses this approach.

      Twproject data model instead, uses a children-to-parent pointer, so that we convert data both ways.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: