Ajax Dock throwing errors

[hacker]

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

[hacker]

Anybody?

[Valeri Hristov]

Hi Shawn,

I pasted the code you sent us in an empty page, but was not able to reproduce the problem. Actually, I get a javascript exception "Object expected" due missing functions:

<script type="text/javascript">window.onload = function(){ajaxManager.AjaxRequest("'" + getMaxWidth() + "','" + getMaxHeight() + "'");}</script>

Could you please, open a new support ticket and send us a complete page, which could be used to reproduce the problem?

All the best,
Valeri Hristov (Senior Developer, MCSD)
the telerik team

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

[Valeri Hristov]

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

[hacker]

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

[hacker]

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

[Tsvetie]

Hello Shawn,
We are aware of this issue and our developers are currently working on it.

All the best,
Tsvetie
the telerik team

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

[Peter]

I found a way to reliably reproduce this problem.  Put a repeater with an AlternatingItemTemplate.   If that repeater is databound, it seems to cause all other docks on the page to get doubled on every event.

[UT_DEV]

Hello all,
The the same issue can you fix it as soon as possible, if required I can start a support ticket

[Valeri Hristov]

Hello guys,

Most probably you already know this, but the following thread contains more information about that javascript exception:
http://www.telerik.com/community/forums/thread/b311D-hahcm.aspx

This problem is caused by the way RadDock works and cannot be easily fixed, without causing side effects to the control operation. I will be glad to hear your thoughts about possible ways to fix it.

Best wishes,
Valeri Hristov (Senior Developer, MCSD)
the Telerik team

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