Gantt is empty the first time

7 posts, 0 answers
  1. Richard
    Richard avatar
    9 posts
    Member since:
    Nov 2010

    Posted 09 Jan 2015 Link to this post

    Hi,

    I'm having a problem with the gantt control in my asp web app. To see the content of the gantt control is needed to click twice on it. 

    <telerik:RadGantt runat="server" ID="GanttChart" CssClass="GanttChart" OnDataBound="GanttChart_DataBound"
        Skin="Silk" ListWidth="30%"
        Height="650px" Width="1038px" SelectedView="WeekView" AutoGenerateColumns="false" WorkWeekStart="Monday" WorkWeekEnd="Friday">
        <Columns>
            <telerik:GanttBoundColumn DataField="Title" HeaderText="Attivita" DataType="String" UniqueName="Title" Width="150px" AllowEdit="false"></telerik:GanttBoundColumn>
            <telerik:GanttBoundColumn DataField="Start" HeaderText="Inizio" DataType="DateTime" UniqueName="Start" DataFormatString="dd/MM/yy" Width="65px" AllowEdit="false" />
            <telerik:GanttBoundColumn DataField="End" HeaderText="Fine" DataType="DateTime" UniqueName="End" DataFormatString="dd/MM/yy" Width="65px" AllowEdit="false" />
            <telerik:GanttBoundColumn DataField="PercentComplete" HeaderText="Completamento" DataType="Number" UniqueName="PercentComplete" Width="110px" AllowEdit="false" />
        </Columns>
        <YearView UserSelectable="true" />
     
        <DataBindings>
            <TasksDataBindings IdField="ID" ParentIdField="ParentID" StartField="Start" SummaryField="Summary"
                EndField="End" TitleField="Title" PercentCompleteField="PercentComplete" OrderIdField="OrderID" />
            <DependenciesDataBindings TypeField="Type" IdField="ID" PredecessorIdField="PredecessorID"
                SuccessorIdField="SuccessorID" />
        </DataBindings>
    </telerik:RadGantt>
    protected override void OnPreRender(EventArgs e)
     {
                base.OnPreRender(e);
     
                //Day View
                GanttChart.DayView.DayHeaderDateFormat = "dddd dd/MM";
                GanttChart.DayView.SlotWidth = Unit.Parse("55px");
                GanttChart.DayView.HourSpan = 1;
                GanttChart.DayView.TimeHeaderDateFormat = "HH:mm";
     
     
                //Week View
                GanttChart.WeekView.DayHeaderDateFormat = "ddd dd/MM";
                GanttChart.WeekView.SlotWidth = Unit.Parse("85px");
                GanttChart.WeekView.WeekHeaderDateFormat = "ddd";
     
                //Month View
                GanttChart.MonthView.WeekHeaderDateFormat = "ddd dd";
                GanttChart.MonthView.SlotWidth = Unit.Parse("110px");
                GanttChart.MonthView.MonthHeaderDateFormat = "MMMM yy";
     
                //Year View
                GanttChart.YearView.MonthHeaderDateFormat = "MMM";
                GanttChart.YearView.SlotWidth = Unit.Parse("120px");
                GanttChart.YearView.MonthHeaderDateFormat = "Y";
     
                //Common properties working for all views
                GanttChart.ShowFullTime = true;
                GanttChart.ShowFullWeek = true;
                GanttChart.Culture = CultureInfo.CurrentCulture;
                GanttChart.WorkWeekStart = DayOfWeek.Monday;
                GanttChart.WorkWeekEnd = DayOfWeek.Friday;
                GanttChart.AllowSorting = false;         
     }
    public List<Task> GetGanttDataSource(int projectId)
            {
                List<Task> tasks = new List<Task>();
     
                var taskResult = GetDbResult(projectId);
     
                int hasNext = 0;
     
                foreach (var item in taskResult)
                {
                    Task task = new Task();
     
                    task.ID = item.Id;
     
                    task.ParentID = item.ParentId;
     
                    task.Start = item.Start;
                    task.End = item.End;
                    task.Title = item.Title;
                    task.PercentComplete = item.PercentComplete;
     
                    if (item.Summary)
                        item.Summary = taskResult.Any(x => x.ParentId == item.Id);
     
                    task.Summary = item.Summary;
                    task.Expanded = true;
                    task.OrderID = item.OrderId;
     
                    tasks.Add(task);
                }
     
                return tasks;
     
            }


    The control's datasource is correctly loaded even the first time, so is not the way i use the data (or binding) but the page loading or something like this.

    If somebody can help me...

    Thanks...
     
  2. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 14 Jan 2015 Link to this post

    Hi Richard,

    How do you set the datasource? Please attach sample, so we can try to debug your code.

    Thanks.

    Regards,
    Hristo Valyavicharski
    Telerik
  3. Richard
    Richard avatar
    9 posts
    Member since:
    Nov 2010

    Posted 14 Jan 2015 in reply to Hristo Valyavicharski Link to this post

    Hi Hristo,

    Solved!  the problem was caused by an update panel. I've removed the Gantt Control from the update panel and works fine.

    Thanks for the answer!
  4. Alex Kapitanovskyy
    Alex Kapitanovskyy avatar
    2 posts
    Member since:
    Jun 2009

    Posted 19 Jan Link to this post

    I have the same problem. I use dynamic UserControl with RadGantt. By first load is gantt content empty. If i comment RadAjaxManager content is correct. I can't disable Ajax for my project. Hier is small example project (.NET 3.5, Telerik Version 2016.3.1027):

    <body>
        <form id="frm_main" runat="server">
            <telerik:RadScriptManager ID="sm" EnableScriptGlobalization="True" AsyncPostBackTimeout="800"
                OutputCompression="AutoDetect" EnableScriptCombine="true" ScriptMode="Auto" runat="server">           
            </telerik:RadScriptManager>
            <telerik:RadAjaxManager ID="ram" runat="server">
                <AjaxSettings>
                    <telerik:AjaxSetting AjaxControlID="Button2">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="div_mcnt" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
     
                </AjaxSettings>
            </telerik:RadAjaxManager>
     
            <asp:Button ID="Button2" runat="server" Text="Button" OnClick="Button2_Click" />
     
            <div id="div_mcnt" runat="server">
                <asp:Panel ID="plh" runat="server"></asp:Panel>
            </div>
     
        </form>
    </body>
    </html>
    protected void Button2_Click(object sender, EventArgs e)
            {
                plh.Controls.Clear();
                UserControl ctl = (UserControl)LoadControl("TestGantt.ascx");
                ctl.ID = "uc1";
     
                plh.Controls.Add(ctl);
            }
    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="TestGantt.ascx.cs" Inherits="WebApplication1.TestGantt" %>
    <telerik:RadGantt ID="RadGantt1"
        runat="server"
        ReadOnly="true"
        SelectedView="YearView"
        ShowFullTime="false">
        <DayView UserSelectable="false" />
        <YearView UserSelectable="true" />
        <DataBindings>
            <TasksDataBindings IdField="PL_Nr" ParentIdField="PL_Nr_parent" StartField="PL_Start"
                OrderIdField="SortOrder" SummaryField="Summary" ExpandedField="Expanded" EndField="PL_End" TitleField="PL_Descriptiion" />
            <DependenciesDataBindings IdField="ID" PredecessorIdField="PredecessorID"
                SuccessorIdField="SuccessorID" TypeField="Type" />
        </DataBindings>
    </telerik:RadGantt>
    public partial class TestGantt : System.Web.UI.UserControl
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                FillGant();
            }
     
            protected class LpcGantTask : Task
            {
                public int? PL_Nr_Parent { get; set; }
                public int PL_Nr { get; set; }
                public DateTime PL_Start { get; set; }
                public DateTime PL_End { get; set; }
                public string PL_Descriptiion { get; set; }
                public int Level { get; set; }
                public int SortOrder { get; set; }
     
            }
     
     
            private void FillGant()
            {
                RadGantt1.DataSource = LpcTasks;
                RadGantt1.ShowTooltip = false;
                List<Dependency> emptyDependencies = new List<Dependency>();
                Dependency dep = new Dependency();
                dep.ID = 0;
                dep.PredecessorID = 0;
                dep.SuccessorID = 0;
                dep.Type = DependencyType.FinishStart;
                emptyDependencies.Add(dep);
                RadGantt1.DependenciesDataSource = emptyDependencies;
                RadGantt1.DataBind();
     
            }
     
     
     
            protected List<LpcGantTask> LpcTasks
            {
                get
                {
                    List<LpcGantTask> tasks = new List<LpcGantTask>();
                    for (int i = 0; i < 10; i++)
                    {
                        LpcGantTask task = new LpcGantTask();
                        task.Level = 1;
                        task.PL_Nr = i;
                        task.PL_Nr_Parent = null;
                        task.PL_Descriptiion = "Task " + i.ToString();
                        task.PL_Start = DateTime.Now.AddDays(i);
                        task.PL_End = DateTime.Now.AddDays(i + 1);
                        task.Summary = false;
                        task.Expanded = true;
                        task.OrderID = i;
                        tasks.Add(task);
                    }
                    return tasks;
                }
            }
        }
  5. Nencho
    Admin
    Nencho avatar
    1561 posts

    Posted 23 Jan Link to this post

    Hello Alex,

    Indeed, the RadGantt has a bug in such scenario, when it is loaded trough a UserControl and with an AjaxRequest. The bug could be observed and voted in our public portal:

    https://feedback.telerik.com/Project/108/Feedback/Details/183208-radgantt-not-properly-loaded-when-placed-in-a-usercontrol-and-loaded-on-the-page


    As a workaround, you can call the resize method on its widget, using the pageLoad event:

    <script type="text/javascript">
        function pageLoad() {
            setTimeout(function () {
                $find("uc1_RadGantt1")._widget.resize();
            }, 100)
        }
    </script>


    Regards,
    Nencho
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  6. Alex Kapitanovskyy
    Alex Kapitanovskyy avatar
    2 posts
    Member since:
    Jun 2009

    Posted 24 Jan in reply to Nencho Link to this post

    Hello Nencho

    Thank you.

    I tried their solution (using resize), but in my exapmle the Gantt still remains empty. Could you propose another idea to solve my problem?

    Regards,

     

  7. Nencho
    Admin
    Nencho avatar
    1561 posts

    Posted 25 Jan Link to this post

    Hello Alex,

    Could you try increasing the timeout value and test the behavior again? If the issue still persist, please attach a sample runnable example to the support ticket that you have submitted, in order to inspect your exact implementation and determine why the workaround is not applicable.

    Regards,
    Nencho
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top