JSON Error on Drag with AJAX

[Eric]

I've seen this error discussed several time in posts dating back many months.   http://www.telerik.com/community/forums/aspnet-ajax/docking/json-error-on-raddock.aspx

From what I saw the error was due to a a "non-docked" dock being updated via an AJAX request.  This is exactly what I am attempting to do.  I need to create a new Docks via ajax requests, give the user the ability to drag them around undocked, have additional ajax requests fire (such as via a timer control, or keypress event).

The official answer from telerik on the posts I saw was that this is a known issue and is it on your TODO list for the next release.  That was a few releases ago.

I would like to know if this is now supported, and if so is there an example somewhere that demonstrates this?

Thanks as always Telerik team!

Eric Smith

[Pero]

Hello Eric,

There are two ways to ajaxify the RadDock control:

1. If the RadDocks are always docked to a zone, ajaxify the RadDockZone itself and the RadDocks docked inside will always be updated by AJAX calls.

2. If the RadDocks are floating, you need to update the content and not the RadDock itself, because, as you may know, when the dock is dragged it actually moves outside the UpdatePanel and dock with the same id is recreated in the panel - which on the other hand throws an exception.
  
There should not be any problems when you perform additional ajax requests that do not affect the floating RadDocks that are on the page, if only the content is ajaxified and not the dock itself. Because, the docks are never added to an AjaxPanel, when ajax request occurs they are never recreated and only the controls that are affected by the request are updated.


Sincerely yours,
Pero
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Abed allateef Qaisi]

Dears,

 

thanks for your post,

 

I have the same problem, I tried to do as you said but unfortinulty the same error exist as you can find in my test Portal:

 

http://amazingwork.org/MyPage.aspx

Please any advice, I need to fix this issue ASAP.

this is My content Page HTML Code

 

 

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterThemeWithoutMenu.Master"
    AutoEventWireup="true" CodeBehind="MyPage.aspx.cs" Inherits="AmazingWork.MyPage" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <link href="/AWDragStyle/Dock.AWDragStyle.css" rel="stylesheet" type="text/css" />
    <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <table style="width: 900px">
                <tr>
                    <td>
                        <asp:Button ID="Button1" runat="server" OnClick="ButtonAddDock_Click" Text="ADD" />
                        <asp:DropDownList ID="DropDownList1" runat="server">
                            <asp:ListItem Value="~/test.ascx"></asp:ListItem>
                            <asp:ListItem Value="~/test2.ascx"></asp:ListItem>
                        </asp:DropDownList>
                    </td>
                </tr>
                <tr>
                    <td style="height: 300px">
                        <telerik:RadDockLayout ID="RadDockLayout1" runat="server" OnLoadDockLayout="RadDockLayout1_LoadDockLayout"
                            OnSaveDockLayout="RadDockLayout1_SaveDockLayout" StoreLayoutInViewState="True">
                    </td>
                    <td class="style1" valign="top">
                        <telerik:RadDockZone ID="RadDockZone3" runat="server" Orientation="Horizontal" Width="305px">
                        </telerik:RadDockZone>
                    </td>
                    <td valign="top">
                        <telerik:RadDockZone ID="RadDockZone4" runat="server" Orientation="Horizontal" Width="305px">
                        </telerik:RadDockZone>
                    </td>
                    <td valign="top">
                        <telerik:RadDockZone ID="RadDockZone1" runat="server" Orientation="Horizontal" Width="305px">
                        </telerik:RadDockZone>
                        </telerik:RadDockLayout>
                    </td>
                </tr>
            </table>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
    <div style="width: 0px; height: 0px; overflow: hidden; position: absolute; left: -10000px;">
        Hidden UpdatePanel, which is used to help with saving state when minimizing, moving
        and closing docks. This way the docks state is saved faster (no need to update the
        docking zones).
        <asp:UpdatePanel runat="server" ID="UpdatePanel1" UpdateMode="Conditional">
        </asp:UpdatePanel>
    </div>
</asp:Content>

[Pero]

Hello Abed,

Sometimes when a dock is dragged too quickly an AJAX conflict may occur, because a new AJAX request is initiated before even the first one has finished and a new dock with the same id is created and an error occurs. To resolve this problem place a RadAjaxLoadingPanel over the zones to ensure that any previous ajax requests have finished before a new one is initialized.

For your convenience I have modified the my portal demo to display a LoadingPanel while a partial page update is in progress (I have set Transparency=100 and MinDipsplayTime=10, so the panel is not actually displayed. Do not set the Transparency property and the panel will be shown) . Please find it attached to the thread.


Sincerely yours,
Pero
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Abed allateef Qaisi]

Dear Sir,

itis a great sample, but i still have one problem, some time when i drag the dock to other place after that i lost the control on this dock, and this is mean that i am not able to move it again only by make another post pack .

thanks,
Abed M.Qaisi

[Pero]

Hello Abed,

Could you please provide detailed steps to follow in order to reproduce the problem locally? I tested the sample project but did not experience any issues.

The following projects from our Code Library might be helpful:

• http://www.telerik.com/community/code-library/aspnet-ajax/docking/save-dockstate-in-database-using-radajaxmanager.aspx
• http://www.telerik.com/community/code-library/aspnet-ajax/docking/saving-state-of-dynamically-created-raddocks-in-database-using-hidden-updatepanel.aspx

All the best,
Pero
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Abed allateef Qaisi]

Dear Sir,

tha project you attahced before is working fine, but the problem occured when i tried to use Master Page , could you please try to use Master Page , you will face alot of error.

I really appricate if you can  attached another sample using master page.

thanks,

your support is really amazing :)

Abed M.Qaisi

[Pero]

Hi Abed,

I reworked one of the projects from our Code Library (that I recommended in my previous post), to use master page. It is attached to the thread.

Sincerely yours,
Pero
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Chris Mitchell]

Hi Pero,

First of all.. Great examples.. The HiddenPanel example found at http://www.telerik.com/community/code-library/aspnet-ajax/docking/saving-state-of-dynamically-created-raddocks-in-database-using-hidden-updatepanel.aspx was very helpful for me but I got stuck at the dock_Command due to the fact that like the previous poster, I use a RadScriptManager in my Master page rather than the individuals..

While I see the updated LoadPanel example that you posted that uses Master pages, I wondered if you could update the HiddenPanel example the same way as I much prefer it (my users won't like the loading "swirly" appearing constantly.

Thanks in advance; I'm on a nasty deadline so this would be a huge help.

[Pero]

Hello Chris,

Please find the reworked project attached to the thread. If the problem persists, please open a support ticket and provide a fully working project and we will do our best to help.

Regards,
Pero
the Telerik team