[Solved] Error with any telerik control inside of a raddock

[David Moore]

I have a portal page setup and whenever I add a telerik control into one of my docks I get an error.  Works perfectly with any of the built in .NET controls.  (these are inside user controls that I'm pulling in)


Here's what I get in firefox:

missing : after property id

_getAbbrMonthIndex()("")ScriptRe...=4071d537 (line 927)

ScriptResource.axd?d=d5l4af5wuB-XVUjD7tRrTuiC4aVwcD2XTmWbhkRyJe6wPIHJAlOZfi9jkB6ziJpwHgWVFsu65xQHis3GymRLcQ2&t=ffffffffde9b9a70()()ScriptRe...fde9b9a70 (line 499)

T\'","M/d/yyyy","h:mm tt","yyyy\'-\'MM\'...ontent_RadDockf1658171-4abc-482b-93f1-61

and in IE:

A runtime Error has occurred.
Do you wish to Debug?

Line 526
Error: Expected ':'

Here is the dashboard page:

<%@ Page Language="C#" MasterPageFile="~/resources/masterPages/insideFB_Members.master" Theme="insideFB" AutoEventWireup="true" CodeFile="dashboard.aspx.cs" Inherits="dashboard" Title="Dashboard" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit"%>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<asp:Content ID="Content1" ContentPlaceHolderID="mainContent" Runat="Server">

<div ID="pnlOpen" runat="server" class="modalPopup" style="display:none;">

<div style="width:500px;" id="searchDIV">
<div class="modalHeader" style="text-align:right;">
<asp:LinkButton ID="closeSearch" runat="server" Text="Close Window" ForeColor="White"></asp:LinkButton>
    &nbsp;&nbsp;&nbsp;&nbsp;
</div>
</div>
<div style="width:500px;" id="OpenDIV">

   <asp:CheckBoxList ID="cbxWebParts" runat="server">
    </asp:CheckBoxList>

<br />
<asp:button runat="server" CssClass="button" id="ButtonAddDock" text="Add Dock" onclick="ButtonAddDock_Click" />

</div>
</div>

 <ajaxToolkit:ModalPopupExtender ID="selectModule_MPE" runat="server"
    TargetControlID="imAdd"
    PopupControlID="pnlOpen"
    BackgroundCssClass="modalBackground"
    CancelControlID="closeSearch" OkControlID="closeSearch"
 />

    <asp:ImageButton ID="imAdd" runat="server"
        ImageUrl="~/resources/styles/graphics/addItem.gif" />
    <asp:ImageButton ID="imReset" runat="server" Visible="false"
        ImageUrl="~/resources/styles/graphics/resetToDefault.gif" />



        <br/>
<InsideFB:RadDockLayoutNew runat="server" id="RadDockLayout1"
            onsavedocklayout="RadDockLayout1_SaveDockLayout"
            onloaddocklayout="RadDockLayout1_LoadDockLayout">
            <InsideFB:RadDockZoneNew runat="server" id="RadDockZone1" SkinID="Office2007" width="445" MinHeight="200" style="float:left;margin-right:15px;background: #f5f4e8;">
            </InsideFB:RadDockZoneNew>
            <InsideFB:RadDockZoneNew runat="server" id="RadDockZone2" SkinID="Office2007" width="445" MinHeight="200" style="background: #f5f4e8;float:left;">
            </InsideFB:RadDockZoneNew>
            <div style="display:none">
                Hidden UpdatePanel, which is used to receive the new dock controls.
                We will move them with script to the desired initial dock zone.
                <asp:updatepanel runat="server" id="UpdatePanel1">
                    <triggers>
                        <asp:asyncpostbacktrigger controlid="ButtonAddDock" eventname="Click" />
                    </triggers>
                </asp:updatepanel>
            </div>
        </InsideFB:RadDockLayoutNew>
</asp:Content>

and the dock:

<%@ Control Language="C#" AutoEventWireup="true" EnableViewState="true" CodeFile="Task.ascx.cs" Inherits="UserControls_Task" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit"%>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<script type="text/javascript">

    function PopupOpening(sender, args) {
        Telerik.Web.UI.Calendar.Popup.zIndex = 110000;
    }

</script>

<div class="sectionContent">

<asp:UpdatePanel ID="taskUpdate" runat="server">
<ContentTemplate>

<asp:Panel ID="addTaskPanel" runat="server">
    <table>
        <tr>
            <td>
                <asp:TextBox ID="newTask_TB" runat="server" Width="150"></asp:TextBox>
            </td>
            <td>
                <telerik:RadDateTimePicker ID="taskenddate_RDTP" Skin="Office2007" runat="server">
                    <Calendar DayNameFormat="FirstLetter"
                           UseColumnHeadersAsSelectors="False"
                           UseRowHeadersAsSelectors="False">
                    </Calendar>
                    <ClientEvents OnPopupOpening="PopupOpening" />
                </telerik:RadDateTimePicker>
            </td>
            <td style="padding-left:20px;"><asp:ImageButton ID="addTask_BTN" runat="server" OnClick="addTask_BTN_Click" ImageUrl="~/resources/styles/graphics/inlineInsert.gif" /></td>
        </tr>
    </table>



</asp:Panel>

<hr />


<asp:GridView ID="tasksGrid" runat="server" AutoGenerateColumns="False" DataKeyNames="taskid"
        DataSourceID="task_LDS" OnRowDataBound="tasksGrid_RowDataBound">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:CheckBox ID="select_CB" runat="Server"/>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField DataField="taskid" HeaderText="taskid"
            InsertVisible="False" ReadOnly="True" SortExpression="taskid" Visible="false" />
        <asp:BoundField DataField="taskdate" HeaderText="Date" DataFormatString="{0:d} {0:t}"
            SortExpression="taskdate" />
        <asp:BoundField DataField="tasktext" HeaderText="Task"
            SortExpression="tasktext" ItemStyle-Wrap="true" />
    </Columns>
    <EmptyDataTemplate>
        <div class="gridView_NoRecords">
                <p>
               No active tasks.
               </p>
        </div>
    </EmptyDataTemplate>
</asp:GridView>


</ContentTemplate>
<Triggers>
    <asp:AsyncPostBackTrigger ControlID="addTask_BTN" EventName="Click" />
</Triggers>
</asp:UpdatePanel>

    <asp:LinqDataSource ID="task_LDS" runat="server"
        ContextTypeName="insidefbDataContext" TableName="entitytasks" OnSelecting="task_LDS_Selecting">
    </asp:LinqDataSource>

<br />
<asp:Button ID="DeleteTasks" runat="server" Text="Mark Complete" OnClick="DeleteTasks_Click" />
</div>

Thanks
~Dave

[Pero]

Hello Dave,

We were able to recreate the problem on our side by creating a sample project that dynamically adds RadDocks (with RadCalendar inside) to a RadDockZone. The problem seems to be caused by the following code line:

dock.ID = Guid.NewGuid().ToString();

It returns an ID which contains "-". By default you cannot use strings as IDs of ASP.NET controls that contain the "-" character. So the "-" character should be replaced with a "legal" ASP.NET character. For an example this line of code should be used instead:

dock.ID = Guid.NewGuid().ToString().Replace('-', 'a') ;

  
One of our examples for dynamic RadDock creation uses the code line that causes the error. That might have led you to the problem. We apologize for the inconvenience, and we will  fix it as soon as we can.

Kind regards,
Pero
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[David Moore]

Excellent, thanks for looking into it.

Cheers
~Dave