RadGrid issue IE 9

[D]

Hello Telerik,

We have a RadGrid and a Gantt in a RadPageView.
The issue is when the RadGrid is set Visible="true" Gantt is no longer display. And when the RadGrid is set Visible="false", the Gantt appears this time.

On screen attached "issue1.png", the RadGrid ist set to Visible = true, so no gantt
On "issue2.png", the RadGrid is set to Visible = false, Gantt appears.

For information, this problem didn't exist before and it does not appear with Chrome and Firefox.
On "issue3.png", see the expected result (from Chrome).

Thanks .

[Maria Ilieva]

Hi,

Based on the provided screenshots it s rather difficult to determine what exactly is causing the problematic behavior in IE. Could you please let me know are the RadGrid control and the Gantt ajaxified? If yes please disable the ajax on the page and verify if this makes any difference. Also let me know if the issue appear in all versions of IE browser? Does the same behavior could be replicated in IE10?
Sharing your page markup as well as the related code behind and the information I have requested above will help us further investigate the issue and do our best to provide proper solution for your case.

Regards,
Maria Ilieva
Telerik

[D]

Hi, thanks for the reply.

- RadGrid control and the Gantt aren't ajaxified.
- Issue appears in IE10 and IE9.

I almost left the structure of the page :

<%@ Assembly Name="$SharePoint.Project.AssemblyFullName$" %>
<%@ Assembly Name="Microsoft.Web.CommandUI, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls"
    Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="asp" Namespace="System.Web.UI" Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<%@ Register TagPrefix="wssawc" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Import Namespace="Microsoft.SharePoint" %>
<%@ Register TagPrefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages"
    Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="PSM_ProjectMgtUserControl.ascx.cs"
    Inherits="PSM_ProjectMgt.PSM_ProjectMgt.PSM_ProjectMgtUserControl" %>
<%@ Register Assembly="Telerik.Web.UI, Version=2013.2.717.35, Culture=neutral, PublicKeyToken=121fae78165ba3d4"
    Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<input type="hidden" id="nodeValueHiddenField" runat="server" />
<input type="hidden" id="currentProjectValueHiddenField" runat="server" />
<telerik:RadScriptBlock runat="server" ID="radScriptBlock">
    <script type="text/javascript">
        // Function used to open the page specified in parameter
        function openDialogAction(url, titleAction, titleProject) {
            var RadWindowManagerAction = $find("<%= RadWindowManagerAction.ClientID %>");
            RadWindowManagerAction.open(url + "?TitleAction=" + titleAction + "&TitleProject=" + titleProject, "RadWindowAddAction");
            return false;
        }

        // Function used to do a refresh on page
        function CloseCallback(DialogResult, value) {
            SP.UI.ModalDialog.RefreshPage(SP.UI.DialogResult.OK);
        }

        function onRowDropping(sender, args) {
            var nodeHiddenField = "<%= nodeValueHiddenField.ClientID %>";
            if (currentNode) {
                $get(nodeHiddenField).value = currentNode.get_value();
                args.set_destinationHtmlElement("nodeValueHiddenField");
            }
            else {
                args.set_cancel(true);
            }
        }

        var currentNode = null;

        function onNodeMouseOver(sender, args) {
            //gets the node upon mousing over the node
            currentNode = args.get_node();
        }

        function onNodeMouseOut(sender, args) {
            //resets the currentNode value upon mousing out
            currentNode = null;
        }

        var _jsGridControl;

        ExecuteOrDelayUntilScriptLoaded(function () {
            var oldGanttControl = SP.GanttControl;
            SP.GanttControl = function () {
                oldGanttControl.call(this);
                var oldInit = this.Init;
                this.Init = function (jsGridControl, jsRawGridData, params) {
                    oldInit.call(this, jsGridControl, jsRawGridData, params);
                    DoCustomizations(jsGridControl);
                };
            };
        }, "SPGantt.js");

        function DoCustomizations(grid) {
            _jsGridControl = grid;
            grid.SetSplitterPosition(150); //set the splitter position
            grid.HideColumn("PSMActionStartDate");
            grid.HideColumn("PSMActionEndDate");
            grid.SetGanttZoomLevel(grid.GetGanttZoomLevel() + 3); //set the zoom level
        }

        function OnClientValueChanged(sender, args) {
            var oldValue = args.get_oldValue();
            var newValue = args.get_newValue();

            if (oldValue < newValue) {
                if (oldValue == 2) {
                    _jsGridControl.SetGanttZoomLevel(_jsGridControl.GetGanttZoomLevel() + 2);
                }
                else {
                    _jsGridControl.SetGanttZoomLevel(_jsGridControl.GetGanttZoomLevel() + 1);
                }
            }
            else {
                if (newValue == 3) {
                    _jsGridControl.SetGanttZoomLevel(_jsGridControl.GetGanttZoomLevel() - 2);
                }
                else {
                    _jsGridControl.SetGanttZoomLevel(_jsGridControl.GetGanttZoomLevel() - 1);
                }
            }
        }

        function CheckModel(sender, args) {
            args.IsValid = false;
            var combo = $find("<%= RadComboBoxModel.ClientID %>");
            var text = combo.get_value();
            if (args.Value != "" && text != "0") {
                args.IsValid = true;
                return;
            }
            return;
        }
        var ajaxManagerTemp;
        function refreshGrid(arg) {
            var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
            if (ajaxManager != null) {
                ajaxManagerTemp = ajaxManager;
                if (arg) {
                    ajaxManager.ajaxRequest("RebindActionsGrid");
                }
            }
            else {
                // document.location.reload(true);
                ajaxManagerTemp.ajaxRequest("RebindActionsGrid");
            }
        }

        function confirmCallBackFn(arg) {
            var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
            if (arg == true) {
                if (ajaxManager != null) {
                    ajaxManager.ajaxRequest("OkConfirm");
                }
            }
            else if (arg == false) {
                if (ajaxManager != null) {
                    ajaxManager.ajaxRequest("NOkConfirm");
                }
            }
        }

    </script>
</telerik:RadScriptBlock>
<telerik:RadWindowManager runat="server" ID="RadWindowManager1">
</telerik:RadWindowManager>
<telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1"
    SelectedIndex="0" CssClass="tabStrip" Visible="True" Width="100%" OnTabClick="RadTabStrip1_TabClick">
</telerik:RadTabStrip>
<telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0" CssClass="multiPage">
    <telerik:RadPageView ID="RadPageViewCreate" runat="server" Width="100%" Height="100%">
    </telerik:RadPageView>
    <telerik:RadPageView ID="RadPageViewStruct" runat="server" Width="100%" Height="100%">
    </telerik:RadPageView>
    <telerik:RadPageView ID="RadPageViewPlan" runat="server" Width="100%" Height="700px">
        <telerik:RadSplitter ID="RadSplitterPlanification" runat="server" BorderSize="0"
            BorderStyle="None" Orientation="Horizontal" Width="100%" Height="100%">
            <telerik:RadPane ID="RadPanePlanificationGridActions" Height="50%" Width="100%" runat="server"
                Scrolling="Both">
                <table>
                    <tr>
                        <td>
                            <br />
                            <br />
                            <telerik:RadGrid runat="server" ID="RadGridPlanActions" AutoGenerateColumns="False" Visible="true"
                                GridLines="None" AutoGenerateEditColumn="false" OnNeedDataSource="RadGridPlanActions_NeedDataSource"
                                OnItemDataBound="RadGridPlanActions_ItemDataBound" OnUpdateCommand="RadGridPlanActions_UpdateCommand"
                                OnItemCreated="RadGridPlanActions_ItemCreated" OnCancelCommand="RadGridPlanActions_CancelCommand"
                                AllowPaging="True" PageSize="10" PagerStyle-Mode="NumericPages" OnPageIndexChanged="RadGridPlanActions_PageIndexChanged"
                                OnEditCommand="RadGridPlanActions_EditCommand" OnDeleteCommand="RadGridPlanActions_DeleteCommand"
                                Width="100%">
                                <MasterTableView Width="100%" DataKeyNames="Title" EditMode="EditForms">
                                    <Columns>
                                        <telerik:GridBoundColumn DataField="Title" HeaderText="Title" UniqueName="Title"
                                            ReadOnly="True" Visible="False">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridBoundColumn DataField="PSMActionName" HeaderText="PSMActionName" UniqueName="PSMActionName"
                                            ReadOnly="True">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridBoundColumn DataField="PSMActionDescription" HeaderText="PSMActionDescription"
                                            UniqueName="PSMActionDescription" Visible="false" ReadOnly="True">
                                        </telerik:GridBoundColumn>
                                        <telerik:GridDateTimeColumn DataField="PSMActionStartDate" HeaderText="PSMActionStartDate"
                                            UniqueName="PSMActionStartDate">
                                        </telerik:GridDateTimeColumn>
                                        <telerik:GridDateTimeColumn DataField="PSMActionEndDate" HeaderText="PSMActionEndDate"
                                            UniqueName="PSMActionEndDate">
                                        </telerik:GridDateTimeColumn>
                                        <telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditCommandColumn">
                                        </telerik:GridEditCommandColumn>
                                        <telerik:GridButtonColumn ConfirmDialogType="Classic" ConfirmTitle="Delete" ButtonType="ImageButton"
                                            CommandName="Delete" UniqueName="DeleteColumn">
                                        </telerik:GridButtonColumn>
                                    </Columns>
                                    <EditFormSettings>
                                        <EditColumn UniqueName="EditCommandColumn" ButtonType="ImageButton">
                                        </EditColumn>
                                    </EditFormSettings>
                                </MasterTableView>
                            </telerik:RadGrid>
                        </td>
                    </tr>
                </table>
            </telerik:RadPane>
            <br />
            <br />
            <telerik:RadPane ID="RadPanePlanificationGantt" runat="server" Height="50%" Width="100%"
                Scrolling="None">
                <telerik:RadSplitter ID="RadSplitter2" runat="server" Orientation="Horizontal">
                    <telerik:RadPane ID="RadPane5" runat="server" Height="7%" Width="100%" Scrolling="None">
                        <table align="center">
                            <tr>
                                <td>
                                    <asp:Label ID="LabelGanttLabel" runat="server" Visible="true" Text="Zoom Gantt :"></asp:Label>
                                </td>
                                <td>
                                    <telerik:RadSlider ID="RadSliderGantt" Visible="true" runat="server" OnClientValueChanged="OnClientValueChanged"
                                        MaximumValue="5" MinimumValue="0" Style="margin-left: 0px" DecreaseText="" IncreaseText=""
                                        DragText="">
                                    </telerik:RadSlider>
                                </td>
                            </tr>
                        </table>
                    </telerik:RadPane>
                    <br />
                    <telerik:RadPane ID="RadPaneContainerGantt" runat="server" Height="93%" Width="100%"
                        BorderStyle="None" BorderWidth="0">
                    </telerik:RadPane>
                </telerik:RadSplitter>
            </telerik:RadPane>
        </telerik:RadSplitter>
    </telerik:RadPageView>
    <telerik:RadPageView ID="RadPageViewValidateProject" runat="server" Width="100%"
        Height="700px">
    </telerik:RadPageView>
</telerik:RadMultiPage>

Code behind :

public partial class PSM_ProjectMgtUserControl : UserControl

{

    #region Initialize
      private SPList listActions;
      private SPView listViewActions;


    protected void Page_Load(object sender, EventArgs e)

    {

        try

        {

            _SelectedProjectTitle = Request.QueryString["TitleProject"];             

            RadSliderGantt.Value = 2;

            RadSliderGantt.Skin = PSM_GetResources.GetSystemTelerikSkin(language);

            if (!Page.IsPostBack)

            {

                // Create the radtab

                AddRadTab(PSM_GetResources.GetProjectMgtRadTabEdit(language), "0", true);

                AddRadTab(PSM_GetResources.GetProjectMgtRadTabStruct(language), "1", false);

                AddRadTab(PSM_GetResources.GetProjectMgtRadTabPlan(language), "2", false);

                AddRadTab(PSM_GetResources.GetProjectMgtRadTabValidateProject(language), "3", false);

                RadTabStrip1.Skin = "Office2010Silver";                                    

            }                                     

        }

        catch (Exception ex)

        {               

        }

    }      

    private void AddRadTab(string tabName, string value, bool enabled)

    {

        RadTab tab = new RadTab();

        tab.Text = tabName;

        tab.Value = value;

        tab.Enabled = enabled;

        RadTabStrip1.Tabs.Add(tab);

    } 

    protected void RadTabStrip1_TabClick(object sender, RadTabStripEventArgs e)

    {

        try

        {

            switch (e.Tab.Value)

            {

                case "0":

                    break;

                case "1":                      

                    break;

                case "2":                       

                    CreateGanttView();

                    LoadGanttData();

                    RadGridPlanActions.DataSource = GetDataTableActionsPlanification();

                    RadGridPlanActions.DataBind();                      

                    break;

                case "3":                    

                    break;

            }

        }

        catch (Exception ex)

        {               

        }

    }

    #endregion

          

    #region Tab Planification

 

    #region Grid Planification Actions

 

    public DataTable GetDataTableActionsPlanification()

    {

        DataTable table = new DataTable();

        DataColumn[] keys = new DataColumn[1];

        DataColumn dc = new DataColumn();

        dc.ColumnName = "Title";

        keys[0] = dc;

        table.Columns.Add(dc);

        table.PrimaryKey = keys;

 

        dc = new DataColumn();

        dc.ColumnName = PSM_GetResources.GetActionNameInternalName(language);

        table.Columns.Add(dc);

 

        dc = new DataColumn();

        dc.ColumnName = PSM_GetResources.GetActionDescriptionInternalName(language);

        table.Columns.Add(dc);

 

        dc = new DataColumn();

        dc.ColumnName = PSM_GetResources.GetActionStartDateInternalName(language);

        dc.DataType = Type.GetType("System.DateTime");

        table.Columns.Add(dc);

 

        dc = new DataColumn();

        dc.ColumnName = PSM_GetResources.GetActionEndDateInternalName(language);

        dc.DataType = Type.GetType("System.DateTime");

        table.Columns.Add(dc);

 

        table.Rows.Add("Action1Title", "Action1Name", "Action1Description", DateTime.Now, DateTime.Now);   

        return table;

    }

 

    public void RadGridPlanActions_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)

    {

        RadGridPlanActions.DataSource = GetDataTableActionsPlanification();

    }

 

    #endregion

 

    #region GANTT

 

    public void CreateGanttView()

    {

       SPSecurity.RunWithElevatedPrivileges(delegate()

       {

           using (SPSite site = new SPSite(SPContext.Current.Site.Url))

           {

               if (site != null)

               {

                   using (SPWeb web = site.OpenWeb())

                   {

                       web.AllowUnsafeUpdates = true;

                       System.Collections.Specialized.StringCollection strColl = new System.Collections.Specialized.StringCollection();

                       listActions = web.Lists[PSM_GetResources.GetListActionsInternalName(language)];

                       strColl.Add(PSM_GetResources.GetActionNameInternalName(language));

                       strColl.Add(PSM_GetResources.GetActionStartDateInternalName(language));

                       strColl.Add(PSM_GetResources.GetActionEndDateInternalName(language));

                       SPViewCollection views = listActions.Views;


                        try
                            {
                                DeleteRecursivelyGanttView(_List);
                                StringBuilder strQuery
                                = new StringBuilder("<Where><And><Eq><FieldRef Name='" + _QueryArgTargetField + "' /><Value Type='Text'>" + _SelectedNode.Value +
                                    "</Value></Eq><Eq><FieldRef Name='" + _QueryArgTargetFieldIsActive +
                                    "' /><Value Type='Integer'>" + 1 + "</Value></Eq></And></Where>");
                                SPQuery oQuery = new SPQuery();
                                oQuery.Query = strQuery.ToString();
                                SPViewCollection views = _List.Views;
                                SPView _listview = views.Add("PSMGanttView", strColl, oQuery.Query, 100, true, false, Microsoft.SharePoint.SPViewCollection.SPViewType.Gantt, false);
                                _listview.Update();
                                listActions.Update();
                            }
                            catch
                            {
                            }                    

                   web.AllowUnsafeUpdates = false;

                   }

               }

           }

       });

    }

 

    public void LoadGanttData()

    {

        using (SPSite site = new SPSite(SPContext.Current.Site.Url))

        {

            if (site != null)

            {

                using (SPWeb web = site.OpenWeb())

                {

                    web.AllowUnsafeUpdates = true;

                    listActions = web.Lists[PSM_GetResources.GetListActionsInternalName(language)];

                    listViewActions = listActions.Views["PSMGanttView"];

                    Gantt gantt = new Gantt("PSMGanttView", listActions, listViewActions, PSM_GetResources.GetActionNameInternalName(language), PSM_GetResources.GetActionStartDateInternalName(language), PSM_GetResources.GetActionEndDateInternalName(language), "");                      

                    gantt.DataSource = listActions.GetItems(listViewActions).GetDataTable();

                    // Adding Control

                    if (gantt != null)

                    {

                        RadPaneContainerGantt.Controls.Add(gantt);

                    }

                    web.AllowUnsafeUpdates = false;

                }

            }

        }

    }

    #endregion

    #endregion     

}

[Maria Ilieva]

Hello,

I noticed that the presented behavior appear in your application into SharePoint environment. The same could not be replicated in a sample aspx page out of SP. Could you please try to isolate the issue into single aspx page and let me know if the same behavior appear?

Regards,
Maria Ilieva
Telerik

[D]

I am not able to test out sharepoint. I found a workaround by separating the display of the Gantt chart and the RadGrid in different tabs.
click on tab 1 : RadGrid with visible = true.
click on tab 2 : Gantt + RadGrid with visible = false