jQuery Error, Clashing When Setting DockHandle? in UI for ASP.NET AJAX Dock

Daniel Ellis

4 posts

Member since:
Feb 2010

Posted 22 Feb 2010 Link to this post

When I use document.getElementById(...) to get a dock and then call dock.SetHandle(dock), it works perfectly. When I use jQuery to find the same element it finds the element and d.length has a length of 1, but then it crashes when you try to use dock.sethandle(dock). It fails when it tries to call Sys.UI.DomElement.removeCssClass(this._handle,"rdDraggable"); Is something in my jQuery clashing with the Telerik jQuery controls? How can I work around this?

Pero

Admin

1156 posts

Posted 25 Feb 2010 Link to this post

Hi Daniel,

This is expected behavior, because the $(expression, [context] ) jQuery function will not return an HTML element and the dock's set_handle(element) accepts an HTML element as parameter. Try the following code that searches for elements with id="Handle_1", stores the result in var d and alerts d.id and d[0].id. Notice that d.id will alert "undefined" and d[0].id "Handle_1". Basically, if you want to set the dock handle to the element with id="Handle_1" you need to use dock.set_handle(d[0]).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head id="Head1" runat="server">

    <title></title>

    <script type="text/javascript">

        function SetDockHandle()

        {

            var d = $("#Handle_1");

            alert(d.id);

            alert(d[0].id);

        }

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        <asp:ScriptManager ID="scriptmanager1" runat="server">

            <Scripts>

                <asp:ScriptReference Path="~/jquery-1.4.2.js" />

            </Scripts>

        </asp:ScriptManager>

        <input type="button" onclick="SetDockHandle(); return false;" value="Get element ID" />

        <div id="Handle_1">

        </div>

    </div>

    </form>

</body>

</html>

Regards,
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.

Daniel Ellis

4 posts

Member since:
Feb 2010

Posted 26 Feb 2010 Link to this post

Thanks! That worked great. This was a jQuery error on my part. The code I ended up with that works cross-browser looks something like this now:

    
            var d = $("#" + dock.get_id() + "_C_Handle"); 
        
            if(d.length > 0) { 
        
                dock.set_handle(d[0]); 
        
            }