RadWindow $find function returns null in IE6

[Peter]

Hi there,

I'm using the RadWindow 2011 Q3 and for some reason it sporadically throws javascript errors in internet explorer 6. Here is my code:

<telerik:RadAjaxManagerProxy ID="UserAjaxManager" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="UserListGrid">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="UserListGrid" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="RefreshList">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="UserListGrid" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="DeleteSelectedItems">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="UserListGrid" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="Search">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="UserListGrid" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManagerProxy>

<telerik:RadWindowManager ID="RadWindows" runat="server" Skin="Web20" Behaviors="Close,Move,Resize">

        <Windows>

            <telerik:RadWindow Height="362" Width="504" ID="ViewWindow" OnClientClose="updateRadGrid" RegisterWithScriptManager="false" runat="server" CssClass="actionWindow" NavigateUrl="UserEditor.aspx" VisibleStatusbar="false" VisibleTitlebar="true" ReloadOnShow="true">

            </telerik:RadWindow>

        </Windows>

     </telerik:RadWindowManager>

 

     <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

        <script type="text/javascript">

            //View USER

            function showUserViewerWindow(userId)

            {

                var actionWindow = $find("<%=ViewWindow.ClientID %>");

                actionWindow.setUrl("UserViewer.aspx?userId=" + userId);

                actionWindow.show();

            }

 

            //UPDATEGRID

            function updateRadGrid(sender, eventArgs)

            {

                var ajaxManager = $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>");

                ajaxManager.ajaxRequestWithTarget("<%= RefreshList.UniqueID%>");

            }

        </script>

     </telerik:RadCodeBlock>

I have attached alerts to the $find function and I keep getting a null value in IE6, a problem I'm not encountering in any other browsers. Ultimately, Im trying to resize the windows specifically for IE because Autosize ="true" always results in scrollbars. I have attached a screen capture of the script error I'm receiving.

[Marin Bratanov]

Hi Peter,

This seems more like a general AJAX error as the message in is not from the RadControls - you can find multiple resources in the net that discuss this error and its sporadic behavior, for example:
http://forums.asp.net/t/1040587.aspx/1

http://sympmarc.com/2010/08/28/how-to-fix-sys-argumenttypeexception-object-of-type-sys-_application-cannot-be-converted-to-type-sys-_application-error/

http://social.technet.microsoft.com/Forums/en/sharepoint2010programming/thread/50b18cc2-3361-4539-87bc-e50d8f10445e

The most common solutions to the case are presented in these three articles - setting ScriptMode to Release for your script manager, turning of debugging for the application (which is generally a good performance idea) and disabling SmartNavigation (which is, by the way, a deprecated property that should not be used in the first place).

SInce there has been a JavaScript error on the page the browser will not execute JavaScript anymore and thus it will not be able to get a reference to the RadWindow.

Also please check when and how you call this function, it must happen after the Sys.Application.Load event as this is the point when AJAX-enabled controls are instantiated fully.

As for autosizing - I advise you examine this help article on using it properly.

All the best,
Marin
the Telerik team

[Peter]

I am afraid I have read all those posts already! :( Here is code that now works in IE6 and Chrome:

<script type="text/javascript">

            //Declare variables
            var createUser;
            var editWIndow;
            var gridRef;
            var ajax;
            var viewWindow;
            var ajaxTarget;
            var editButton;
            var deleteButton;

            alert("Load");
            //Ie 6
            Sys.Application.add_load(MyFunction);
            function MyFunction()
            {
                viewWindow = $find("<%=ViewWindow.ClientID %>");
                createUser = $find("<%=NewUserWindow.ClientID %>");
                editWIndow = $find("<%=EditWindow.ClientID %>");
                gridRef = $find("<%=UserListGrid.ClientID %>");
                ajax = $find("<%=RadAjaxManager.GetCurrent(Page).ClientID %>");
                viewWindow = $find("<%=EditWindow.ClientID %>");
                ajaxTarget = "<%=RefreshList.UniqueID %>";
                editButton = $find("<%=DeleteSelectedItems.ClientID %>");
                deleteButton = $find("<%=EditUser.ClientID %>");
            }

            //All other browsers
            function pageLoad()
            {
                viewWindow = $find("<%=ViewWindow.ClientID %>");
                createUser = $find("<%=NewUserWindow.ClientID %>");
                editWIndow = $find("<%=EditWindow.ClientID %>");
                gridRef = $find("<%=UserListGrid.ClientID %>");
                ajax = $find("<%=RadAjaxManager.GetCurrent(Page).ClientID %>");
                viewWindow = $find("<%=EditWindow.ClientID %>");
                ajaxTarget = "<%=RefreshList.UniqueID %>";
                editButton = $find("<%=DeleteSelectedItems.ClientID %>");
                deleteButton = $find("<%=EditUser.ClientID %>");
            }

            //CREATE USER
            function showCreateBrokerWindow()
            {
                var actionWindow = createUser;
                actionWindow.setUrl("UserCreate.aspx");
                actionWindow.show();
            }

            //RESET PASSWORD
            function resetPassword(username)
            {
                var actionWindow = editWIndow;
                actionWindow.setUrl("UserResetPassword.aspx?username=" + username);
                actionWindow.show();
            }

            //EDIT USER
            function showUserEditorWindow(userId)
            {
                var actionWindow = editWIndow;
                actionWindow.setUrl("UserEditor.aspx?userId=" + userId);
                actionWindow.show();
            }

            //View USER
            function showUserViewerWindow(userId)
            {
                var actionWindow = viewWindow;
                actionWindow.setUrl("UserViewer.aspx?userId=" + userId);
                actionWindow.show();
            }

            //UPDATEGRID
            function updateRadGrid(sender, eventArgs)
            {
                var ajaxManager = ajax;
                ajaxManager.ajaxRequestWithTarget("<%=RefreshList.UniqueID %>");
            }

            function editButton_Clicked(sender, eventArgs)
            {
                var grid = gridRef;
                //if an item has been selected
                if (grid.get_masterTableView().get_selectedItems().length != 0)
                {
                    showUserEditorWindow(grid.get_masterTableView().get_selectedItems()[0].getDataKeyValue("UserId"));
                }

                return false;
            }

            function grid_rowSelectChanged(sender, eventArgs)
            {

                var grid = gridRef;
                //if more than one row is selected
                if (grid.get_selectedItems().length > 0)
                {
                    //disable delete button
                    deleteButton.set_enabled(true);
                }
                else
                {
                    //disable delete button
                    deleteButton.set_enabled(false);
                }

                if (grid.get_selectedItems().length > 1 || grid.get_selectedItems().length == 0)
                {
                    //disable edit button
                    editButton.set_enabled(false);
                }
                else
                {
                    //disable edit button
                    editButton.set_enabled(true);
                }
            }
        </script>

As you may have noticed, there are multiple page_loads. However, I have tried deleting either one of the those page load blocks and it becomes a case of one browser working over another - also I'd like to add that I have already turned the script mode to release, debug=false and smartnavigation to false. The main issue I'm getting is it either work in IE 7,8,9 or in 6. It always works in chrome. Oddly enough the window ID's are fine its just the grid that is having problems. Please help me, this has been an issue for days now and no-one can figure out.

[Marin Bratanov]

Hi Peter,

I am sorry to say that I also cannot provide further insight on why does this occur under IE6. What I can assume based on this information is that under IE6 the pageLoad() event fires too early and thus some/all/one of the RadControls objects is not yet instantiated. Usually the pageLoad function should be a shortcut to the Sys.Application.Load event, yet it seems that for some reason in your case if tires too early. A reason for this behavior could be that wrong MS AJAX scripts are being sent to the page, for example by the AjaxControlToolkit assembly (we have had reports for this, so you can try removing it from your BIN folder to test). You can also try using a small timeout in the pageLoad function when you setup your global variables, e.g.:

function pageLoad()
            {
                setTimeout(function()
                    {
                         //save references here
                     }, 0); //a zero ms timeout to give time to the browser to complete the other work it has
            }

All the best,
Marin
the Telerik team