This is a migrated thread and some comments may be shown as answers.

Ajax Dock throwing errors

9 Answers 386 Views

Dock

This is a migrated thread and some comments may be shown as answers.

hacker asked on 02 May 2007, 11:46 AM

Hello everyone, hopefully I can get a response from the group about this problem I am having.

Here is a copy of my support ticket that doesn't seem to be getting answered:

I have a page on it with an ImageButton and a 2 RadDocks in a Docking Zone. Everything worked fine until I added the Ajax portion to the page. Now, the dock and the contents appear, but I can't drag the dock out of the zone. In Firefox, I receive this error:

[Exception... "'Sys.ArgumentUndefinedException: Sys.ArgumentUndefinedException: Value cannot be undefined.
Parameter name: element' when calling method: [nsIDOMEventListener::handleEvent]" nsresult: "0x8057001c (NS_ERROR_XPC_JS_THREW_JS_OBJECT)" location: "<unknown>" data: no]

Line 0

Here is the code on my page:

  <asp:Panel runat="server" ID="pnlRightColumn">  
            <telerik:RadDockLayout ID="dockLayout" runat="server">  
                <telerik:RadDockZone ID="dockZoneRight" runat="server" MinHeight="10px" MinWidth="20px"  
                    Style="position: absolute; top: 80px; right: 10px; width: 250px;">  
                    <telerik:RadDock ID="dockLegend" runat="server" Width="250px" Title="Legend" Skin="Office2007"  
                        DefaultCommands="ExpandCollapse">  
                        <ContentTemplate>  
                            <asp:Image ImageUrl="/map.aspx?type=legend" AlternateText="Map Legend" runat="server"  
                                ID="legendImage" /></ContentTemplate>  
                    </telerik:RadDock>  
                    <telerik:RadDock ID="dockLayers" runat="server" Width="250px" Title="Layers" Skin="Office2007"  
                        DefaultCommands="ExpandCollapse">  
                        <ContentTemplate>  
                            <asp:CheckBoxList ID="chkLayers" runat="server" /></ContentTemplate>  
                    </telerik:RadDock>  
                </telerik:RadDockZone>  
            </telerik:RadDockLayout>  
        </asp:Panel>  
        <telerik:RadAjaxManager ID="ajaxManager" runat="server" DefaultLoadingPanelID="loadingMap">  
            <AjaxSettings>  
                <telerik:AjaxSetting AjaxControlID="ajaxManager">  
                    <UpdatedControls>  
                        <telerik:AjaxUpdatedControl ControlID="pnlMap" LoadingPanelID="loadingMap" />  
                        <telerik:AjaxUpdatedControl ControlID="pnlRightColumn" />  
                        <telerik:AjaxUpdatedControl ControlID="panStatusArea" />  
                    </UpdatedControls>  
                </telerik:AjaxSetting>  
                <telerik:AjaxSetting AjaxControlID="pnlMap">  
                    <UpdatedControls>  
                        <telerik:AjaxUpdatedControl ControlID="pnlMap" LoadingPanelID="loadingMap" />  
                        <telerik:AjaxUpdatedControl ControlID="panStatusArea" />  
                    </UpdatedControls>  
                </telerik:AjaxSetting>  
            </AjaxSettings>  
        </telerik:RadAjaxManager>  
        <telerik:RadAjaxLoadingPanel ID="loadingMap" runat="server" Style="padding-top: 100px;"  
            MinDisplayTime="750">  
            <asp:Image ID="loadingImage" runat="server" AlternateText="Loading..." ImageUrl="~/images/loading.gif" />  
        </telerik:RadAjaxLoadingPanel>  
        <asp:Panel ID="pnlMap" runat="server">  
            <asp:ImageButton ID="map" runat="server" ImageUrl="/images/pixel.gif"></asp:ImageButton>  
            <asp:HiddenField ID="sW" runat="server"></asp:HiddenField>  
            <asp:HiddenField ID="sH" runat="server"></asp:HiddenField>  
            <asp:HiddenField ID="state" runat="server"></asp:HiddenField>  
            <asp:HiddenField ID="command" runat="server"></asp:HiddenField>  
            <asp:Literal ID="litScreenScript" runat="server" />  
            <asp:Panel ID="pnlScriptLoad" runat="server">  
  
                <script type="text/javascript">window.onload = function(){<%=ajaxManager.ClientID %>.AjaxRequest("'" + getMaxWidth() + "','" + getMaxHeight() + "'");}</script>  
  
            </asp:Panel>  
            <asp:Panel ID="pnlScriptResize" runat="server">  
  
                <script type="text/javascript">window.onresize = function(){<%=ajaxManager.ClientID %>.AjaxRequest("'" + getMaxWidth() + "','" + getMaxHeight() + "'");}</script>  
  
            </asp:Panel>  
   

I just added the RadDockLayout and it didn't fix the problem. I never needed it before this point.

Also, I have recently added a RadToolbar to another docking zone and that doesn't work either.

Please let me know if you can see anything wrong or possible suggestions to fix it.

Shawn

9 Answers, 1 is accepted

answered on 04 May 2007, 11:50 AM

Hi Shawn,

I just removed the erroneous script and managed to reproduce the problem: I was unable to move the RadDock controls from the zone (they automatically return to their original position) if I drag them below the zone. If they are dragged above the zone, they stay in their new position. This is a known problem in RadDock, caused by the browser: when a dock object is dragged and dropped somewhere on the browser window, the drag-drop script searches for a HTML element where the dock control was dropped on. In Standards mode (when the page has a DOCTYPE) when the page content is small (as in the sample) the browser reports that there is nothing under the last HTML element, which is actually the place you are dropping the dock control, hence it returns in its original position. To resolve the problem you need to put more content on the page, so it fills the whole browser window, or set height 100% to the body, the form and the html elements on your page.

Regards,
Valeri Hristov (Senior Developer, MCSD)
the telerik team

Instantly find answers to your questions at the new Telerik Support Center

answered on 04 May 2007, 01:12 PM

Thanks for the reply.

I am very glad you were table to re-create the problem.

The page does fill the screen but the code is not able to be seen from the sample below. I have had a support ticket open since April 30th and even submitted a sample project but no luck yet.

On the screen, I have an <input> tag that renders an image which fills the screen. There is no way to put additional content on the page because the image takes up the page (similar to google maps).

The reason why you received 'Object Expected' is because the getMaxWidth() and getMaxHeight() functions are in an external javascript file.

I have tried doing the style="height:100%;" but that doesn't work. It was put into the following tags:
head
body
asp:panel that the docklayout is in
asp:panel that the input image tag is in
asp:imagebutton element

Also, if you log into my support tickets area, you will probably see the ticket there.

Shawn

answered on 31 May 2007, 01:29 PM

Just to update the thread....

The errors that were being thrown were fixed in the Service Pack 1.

The docks now work correctly as long as they are docked back into the zone before an Ajax event happens. If I leave a dock floating on the page, it will perform one more ajax request and then it throws a different error.

The error is
Sys.InvalidOperationException: Two components with the same id 'dockLayers' can't be added to the application.
http://localhost/ScriptResource.axd?d=EaT5qpm-zBZ14Hev0wZMLm8KK2c5jWj-tXEw6z3u0bFfjlnM-EOBuZTvVX7dOstht3GsajUnMVMSsi-7cvQchdVweZ_55CHAOTtLFmj8ZNc1&t=633113872226514538
Line 3654

(dockLayers was the dockable object that was floating on the screen)

Then, any further ajax requests come back with a messagebox:

Invalid JSON primitive: .

Shawn