We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

insert javascript gantt in a browse screen

Thread ID:





124468 Jun 10,2016 03:30 PM UTC Oct 31,2016 08:20 PM UTC ASP.NET MVC 5
Tags: Gantt
Michele becchio
Asked On June 10, 2016 03:30 PM UTC

Hi all,
I am doing some experiment in lightswitch html. I have created an entity with some properties (id,taskname, duration, progress etc) and  I am trying to insert a javascript Gantt in a blank browse screen. When I run the application the gantt chart appears but with no values ... and if I move on other screen and I come back to the gantt it doesn't show it completely...
I follow the example but with no results:

Do you have some example about integration of gantt chart in a html client lightswitch application?
Thank you so much

Jonesherine Stephen [Syncfusion]
Replied On June 13, 2016 05:41 PM UTC

Hi Michele,
Thanks for contacting Syncfusion support.
In Lightswitch HTML the element Id won’t be removed while we are navigating the screen. So once we navigate back to the control from another screen more than one Id’s will exist. 
So we need to remove the Gantt object in initialization to resolve this issue as shown below. 
Please find the code snippet below:
// <reference path="~/GeneratedArtifacts/viewModel.js" /> 
myapp.Gantt.sample_data_render = function (element, contentItem) { 
    // Write code here. 
    var itemTemplate = $("<div></div>").attr('id', 'sample_data') 
    // Append the div element to screen  
    contentItem.value.oncollectionchange = function () { 
        if ($("#sample_data").length && $("#sample_data").data("ejGantt")) { 
We have also prepared the sample for your reference 
Please find the sample from the following link: 
Please let us know if you require further assistance on this.

Jone Sherine.P.S.   

Michele becchio
Replied On June 15, 2016 12:19 PM UTC

Hi Stephen,
Thank you so much. The example fits perfectly!
I believe that lightswitch is a powerful tool that, with your syncfusion javascript components can be great!
Thanks a lot

Jonesherine Stephen [Syncfusion]
Replied On June 16, 2016 11:07 AM UTC

Hi Michele, 
Thanks for the Update. 
Please let us know if you require further assistance on this. 
Jone Sherine .P.S. 

Ashley Cresswell
Replied On October 27, 2016 07:56 AM UTC

can this control be amended to load data based on a specific project? 

for example I start with a browse screen, containing a list of projects, when I click on the particular project this loads up a GANTT chart based on this specific project..

This would make it an excellent control to be integrated within Lightswitch

Jonesherine Stephen [Syncfusion]
Replied On October 31, 2016 08:20 PM UTC

Hi Ashley, 
Thanks for the patience 
We have prepared the work around and dynamically changed the Gantt projects. 
Please find the steps below: 
1.      We have created browse screen to show the projects list. 
2.      On click action of these project will re-direct to Gantt project and load Gantt with required datasource. 
Please find the code example below: 
myapp.BrowseProjectTables.ProjectTables_ItemTap_execute = function (screen) { 
    // Write code here.    
    var currentId = screen.ProjectTables.selectedItem.Id; 
    myapp.Gantt["selectedId"] = currentId; 
    // to call the Gantt control initiated screen on click action 
We have also prepared the sample and dynamically changed different Gantt projects for your reference. 
Please find the sample from below location 
Jone sherine P S 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon