Telerik Forums / UI for ASP.NET AJAX
This is a migrated thread and some comments may be shown as answers.

[Solved] Space inserted at top of page Rad Ajax Manager/Toolbar and jQuery.

8 Answers 249 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
Chris
Top achievements
Rank 1
Chris asked on 04 May 2009, 08:50 PM
In a project I am currently working on, I am using the AjaxManager in conjunction with a RadToolBar and jQuery. However, when the ajax request returns, blank space is injected above my toolbar and I can't seem to find the source of the problem. I am using jQuery to show a div containing a status message of the user's interaction with the page. If I disable ajax, the page renders properly.

Before Postback
After Postback

Here is the page definition (sorry, it's a very complex page).
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="TicketDetails.aspx.vb" Inherits="SubPages_TicketDetails" %> 
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
<%@ Register Src="../Controls/UserLookupControl.ascx" TagName="UserLookupControl" 
    TagPrefix="uc1" %> 
<!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 runat="server">  
    <title>Ticket Details</title> 
    <link href="../Styles/HelpDesk.css" rel="Stylesheet" type="text/css" /> 
    <telerik:RadScriptBlock ID="scriptBlock" runat="server">  
 
        <script src="../Scripts/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script> 
 
        <script type="text/javascript">  
            function showStatusPanel(message) {  
                $("#divStatusUpdatePanel").fadeIn(1500, function() { window.setTimeout('hideStatusPanel()', 2000) }).text(message);  
                $("#divStatusUpdatePanel").css('color', 'black');  
            }  
 
            function showErrorInStatusPanel(message) {  
                $("#divStatusUpdatePanel").fadeIn(1500, function() { window.setTimeout('hideStatusPanel()', 15000) }).html(message);  
                $("#divStatusUpdatePanel").css('color', 'red');  
            }  
 
            function hideStatusPanel() {  
                $("#divStatusUpdatePanel").fadeOut(3000);  
            }  
 
            function rebindTicketDetails() {  
                $find("<%= ramControlManager.ClientID %>").ajaxRequest("rebindTicket");  
            }  
 
        </script> 
 
    </telerik:RadScriptBlock> 
    <style type="text/css">  
        </style> 
</head> 
<body> 
    <form id="form1" runat="server">  
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
    </telerik:RadScriptManager> 
    <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" Skin="Vista" /> 
    <telerik:RadAjaxManager ID="ramControlManager" runat="server">  
        <AjaxSettings> 
            <telerik:AjaxSetting AjaxControlID="tbTicketDetails">  
                <UpdatedControls> 
                    <telerik:AjaxUpdatedControl ControlID="tbTicketDetails" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblCategory" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblType" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblStatus" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblQueue" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblGoal" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblOwner" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblSubmitBy" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblSubmitDept" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblSubmitOffice" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblSubmitTelephone" /> 
                    <telerik:AjaxUpdatedControl ControlID="lnkEmail" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblLockedBy" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblDeleteBy" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblCreateBy" /> 
                    <telerik:AjaxUpdatedControl ControlID="lblModifyBy" /> 
                    <telerik:AjaxUpdatedControl ControlID="divTicketID" /> 
                    <telerik:AjaxUpdatedControl ControlID="divTicketSubject" /> 
                    <telerik:AjaxUpdatedControl ControlID="divProblemDescription" /> 
                    <telerik:AjaxUpdatedControl ControlID="gridHistory" /> 
                </UpdatedControls> 
            </telerik:AjaxSetting> 
        </AjaxSettings> 
    </telerik:RadAjaxManager> 
    <telerik:RadToolBar ID="tbTicketDetails" runat="server" Skin="Office2007" Width="100%" 
        AutoPostBack="true">  
        <Items> 
            <telerik:RadToolBarSplitButton> 
                <Buttons> 
                    <telerik:RadToolBarButton runat="server" Text="Add Notes" ImageUrl="~/Images/notebook_pencil.png" 
                        Value="AddNotes" CommandName="AddNotes">  
                    </telerik:RadToolBarButton> 
                    <telerik:RadToolBarButton runat="server" Text="Close" ImageUrl="~/Images/door.png" 
                        Value="CloseTicket" CommandName="CloseTicket">  
                    </telerik:RadToolBarButton> 
                </Buttons> 
            </telerik:RadToolBarSplitButton> 
            <telerik:RadToolBarButton runat="server" Text="Lock" ImageUrl="~/Images/lock.png" 
                Value="LockTicket" CommandName="LockTicket">  
            </telerik:RadToolBarButton> 
            <telerik:RadToolBarButton runat="server" Text="Unlock" ImageUrl="~/Images/lock_unlock.png" 
                Value="UnlockTicket" CommandName="UnlockTicket">  
            </telerik:RadToolBarButton> 
            <telerik:RadToolBarButton runat="server" Text="Create Ticket Tasks" CommandName="CreateTasks" 
                ImageUrl="~/Images/tasks_create.png" Value="CreateTasks">  
            </telerik:RadToolBarButton> 
            <telerik:RadToolBarButton runat="server" Text="Claim Ticket" CommandName="ClaimTicket" 
                ImageUrl="~/Images/card_claimticket.png" Value="ClaimTicket">  
            </telerik:RadToolBarButton> 
            <telerik:RadToolBarButton runat="server" Text="Release Ticket" CommandName="ReleaseTicket" 
                ImageUrl="~/Images/card_releaseticket.png" Value="ReleaseTicket">  
            </telerik:RadToolBarButton> 
            <telerik:RadToolBarButton runat="server" Text="Assign Ticket" CommandName="AssignTicket" 
                ImageUrl="~/Images/card__assignticket.png" Value="AssignTicket">  
            </telerik:RadToolBarButton> 
            <telerik:RadToolBarButton runat="server" Text="Move Ticket" CommandName="MoveTicket" 
                ImageUrl="~/Images/pin_moveticket.png" Value="MoveTicket">  
            </telerik:RadToolBarButton> 
            <telerik:RadToolBarButton runat="server" Text="Reopen Ticket" CommandName="ReopenTicket" 
                Value="ReopenTicket" ImageUrl="~/Images/reopenticket.png" /> 
            <telerik:RadToolBarButton runat="server" Text="Delete Ticket" CommandName="DeleteTicket" 
                ImageUrl="~/Images/delete.png" Value="DeleteTicket">  
            </telerik:RadToolBarButton> 
            <telerik:RadToolBarButton runat="server" Text="Restore Ticket" CommandName="RestoreTicket" 
                ImageUrl="~/Images/restore.png" Value="RestoreTicket">  
            </telerik:RadToolBarButton> 
            <telerik:RadToolBarButton runat="server" Text="Edit Ticket Details" CommandName="EditDetails" 
                ImageUrl="~/Images/ticket_pencil.png" Value="EditDetails">  
            </telerik:RadToolBarButton> 
            <telerik:RadToolBarButton runat="server" Text="Assign Goal" CommandName="AssignGoal" 
                ImageUrl="~/Images/accreditationgoal.png" Value="AssignGoal">  
            </telerik:RadToolBarButton> 
        </Items> 
    </telerik:RadToolBar> 
    <asp:HiddenField ID="hfCategoryID" runat="server" /> 
    <asp:HiddenField ID="hfSubmitByAccount" runat="server" /> 
    <div id="divStatusUpdatePanel">  
    </div> 
    <telerik:RadTabStrip ID="tabTicketDetails" runat="server" SelectedIndex="0" MultiPageID="mpTicketDetails" 
        Skin="Outlook" Width="100%" Orientation="HorizontalTop" ShowBaseLine="true">  
        <Tabs> 
            <telerik:RadTab Text="Ticket Details" PageViewID="viewDetails" Selected="True" Value="Details">  
            </telerik:RadTab> 
            <telerik:RadTab Text="Ticket History" PageViewID="viewHistory" Value="History">  
            </telerik:RadTab> 
            <telerik:RadTab Text="Tasks" PageViewID="viewTasks" Value="Tasks">  
            </telerik:RadTab> 
            <telerik:RadTab Text="Related Tickets">  
                <Tabs> 
                    <telerik:RadTab Text="Associated Tickets" PageViewID="viewAssociatedTickets" Selected="true" /> 
                    <telerik:RadTab Text="Other Tickets By Submitter" PageViewID="viewSubmitByTickets" /> 
                    <telerik:RadTab Text="Other Tickets In Category" PageViewID="viewTicketsInCategory" /> 
                    <telerik:RadTab Text="Create Association" PageViewID="viewCreateAssociation" OnLoad="SetCreateAssociationVisibility" /> 
                </Tabs> 
            </telerik:RadTab> 
        </Tabs> 
    </telerik:RadTabStrip> 
    <telerik:RadMultiPage ID="mpTicketDetails" runat="server" SelectedIndex="0" ScrollBars="Horizontal">  
        <telerik:RadPageView runat="server" ID="viewDetails" Selected="true">  
            <table id="TicketDetailsTable">  
                <tr> 
                    <td colspan="2">  
                        <div id="divTicketHeader">  
                            <div id="divTicketID" runat="server" class="TicketID">  
                                42</div> 
                            <div id="divTicketSubject" runat="server" text="Ticket Subject" class="TicketSubject">  
                                Subject</div> 
                        </div> 
                    </td> 
                </tr> 
                <tr> 
                    <th colspan="2" class="TableHeaderLabel">  
                        Problem:  
                    </th> 
                </tr> 
                <tr> 
                    <td colspan="2">  
                        <div id="divProblemDescriptionContainer">  
                            <div id="divProblemDescription" runat="server">  
                                <h1> 
                                    Problem Description</h1> 
                            </div> 
                        </div> 
                    </td> 
                </tr> 
                <tr> 
                    <td colspan="2">  
                        <table class="InternalTable">  
                            <tr> 
                                <th class="TableHeaderLabel">  
                                    Category:  
                                </th> 
                                <th class="TableHeaderLabel">  
                                    Type:  
                                </th> 
                                <th class="TableHeaderLabel">  
                                    Status:  
                                </th> 
                                <th class="TableHeaderLabel">  
                                    Queue:  
                                </th> 
                                <th class="TableHeaderLabel">  
                                    Accreditation Goal:  
                                </th> 
                            </tr> 
                            <tr> 
                                <td class="DataContainer">  
                                    <asp:Label ID="lblCategory" runat="server" Text="Ticket Category" /> 
                                </td> 
                                <td class="DataContainer">  
                                    <asp:Label ID="lblType" runat="server" Text="Ticket Type" /> 
                                </td> 
                                <td class="DataContainer">  
                                    <asp:Label ID="lblStatus" runat="server" Text="Status Name" /> 
                                </td> 
                                <td class="DataContainer">  
                                    <asp:Label ID="lblQueue" runat="server" Text="Queue Name" /> 
                                </td> 
                                <td class="DataContainer">  
                                    <asp:Label ID="lblGoal" runat="server" Text="Accreditation Goal for Weave" /> 
                                </td> 
                            </tr> 
                        </table> 
                    </td> 
                </tr> 
                <tr> 
                    <td colspan="2">  
                        <table class="InternalTable">  
                            <tr> 
                                <th class="TableHeaderLabel">  
                                    Owned By:  
                                </th> 
                                <th class="TableHeaderLabel">  
                                    Submitted By:  
                                </th> 
                                <th class="TableHeaderLabel">  
                                    Locked By:  
                                </th> 
                                <th class="TableHeaderLabel">  
                                    Deleted By:  
                                </th> 
                            </tr> 
                            <tr> 
                                <td class="DataContainer">  
                                    <asp:Label ID="lblOwner" runat="server" Text="Owner Name" /> 
                                </td> 
                                <td class="DataContainer">  
                                    <div> 
                                        <asp:Label ID="lblSubmitBy" runat="server" Text="Submitter Name" /></div>  
                                    <div> 
                                        <asp:Label ID="lblSubmitDept" runat="server" Text="Department" /></div>  
                                    <div> 
                                        <asp:Label ID="lblSubmitOffice" runat="server" Text="Office" /></div>  
                                    <div> 
                                        <asp:Label ID="lblSubmitTelephone" runat="server" Text="Telephone" /></div>  
                                    <div> 
                                        <asp:HyperLink ID="lnkEmail" runat="server" Text="email@swbts.edu" NavigateUrl="mailto:email@swbts.edu" /></div>  
                                </td> 
                                <td class="DataContainer">  
                                    <asp:Label ID="lblLockedBy" runat="server" Text="Locked By" /> 
                                </td> 
                                <td class="DataContainer">  
                                    <asp:Label ID="lblDeleteBy" runat="server" Text="Delete By" /> 
                                </td> 
                            </tr> 
                        </table> 
                    </td> 
                </tr> 
                <tr> 
                    <th class="TableHeaderLabel">  
                        Created:  
                    </th> 
                    <th class="TableHeaderLabel">  
                        Modified:  
                    </th> 
                </tr> 
                <tr> 
                    <td class="DataContainer">  
                        <asp:Label ID="lblCreateBy" runat="server" Text="Create By Information" /> 
                    </td> 
                    <td class="DataContainer">  
                        <asp:Label ID="lblModifyBy" runat="server" Text="Modify By Informtion" /> 
                    </td> 
                </tr> 
            </table> 
        </telerik:RadPageView> 
    </telerik:RadMultiPage> 
    <telerik:RadAjaxLoadingPanel ID="alpMainLoadingPanel" runat="server" Transparency="2" 
        InitialDelayTime="0" MinDisplayTime="250">  
        <asp:Image ImageUrl="~/Images/loading_large.gif" AlternateText="Loading..." runat="server" 
            ID="imgLargeLoad" /> 
    </telerik:RadAjaxLoadingPanel> 
    <telerik:RadAjaxLoadingPanel ID="alpGridLoadingPanel" runat="server" Transparency="2" 
        InitialDelayTime="0" MinDisplayTime="250">  
        <asp:Image ImageUrl="~/Images/loading_grid.gif" runat="server" AlternateText="Refreshing..." 
            ID="imgGridLoad" /> 
    </telerik:RadAjaxLoadingPanel> 
    <telerik:RadAjaxLoadingPanel ID="alpControlLoadingPanel" runat="server" Transparency="2" 
        InitialDelayTime="0" MinDisplayTime="250">  
        <asp:Image ID="imgControlLoad" ImageUrl="~/Images/loading_control.gif" runat="server" 
            AlternateText="Refreshing..." /> 
    </telerik:RadAjaxLoadingPanel> 
    <telerik:RadWindowManager ID="rwmPageWindowManager" runat="server" Skin="Office2007">  
        <Windows> 
            <telerik:RadWindow Animation="Slide" Width="300px" Height="400px" Behavior="None" 
                Modal="true" runat="server" Overlay="true" Title="Set Accreditation Goal" ID="winAccreditationView" /> 
        </Windows> 
    </telerik:RadWindowManager> 
    </form> 
</body> 
</html> 
 

Here's the CSS
body  
{  
    width: 100%;  
    height: 100%;  
    margin: 0px;  
    overflow: hidden;  
}  
 
/*
    USER LOOKUP CONTROL STYLES
*/ 
.UserLookupControlContainer  
{  
    background-color: #C9DAEE;  
    background-image: url('../Images/GlassBack_200.png');  
    background-repeat: repeat-x;  
    background-position: 15px;  
    border: 1px solid #7991A9;  
    padding: 2px;  
    width: 500px;  
}  
.UserLookupControlSelectedUserContainer  
{  
    padding: 3px;  
    border-collapse: collapse;  
}  
.spanCurrentUserName  
{  
    font-family: Arial, Helvetica, sans-serif;  
    font-size: 14pt;  
    font-weight: bold;  
    color: #2F3F50;  
}  
.UserSelectModeTitle  
{  
    font-family: Arial, Helvetica, sans-serif;  
    background-color: #C9DAEE;  
    background-image: url('../Images/TicketHeaderBack.png');  
    background-repeat: repeat-x;  
    background-position: top;  
    border-bottom-style: solid;  
    border-bottom-width: 1px;  
    border-bottom-color: #4F6379;  
    height: 25px;  
    font-size: 14pt;  
    color: #2F3F50;  
}  
.UserLookupTable TH  
{  
    vertical-align: middle;  
    font-family: Arial, Helvetica, sans-serif;  
    font-size: 10pt;  
    font-weight: bold;  
}  
.UserLookupTable  
{  
    border-collapse: collapse;  
    width: 100%;  
}  
/*
TICKET DETAILS STYLES
*/ 
#TicketDetailsTable  
{  
    background-color: #7991A9;  
    border-style: solid;  
    border-width: 1px 2px 2px 1px;  
    border-color: #4F6379 #2F3F50 #2F3F50 #4F6379;  
    padding: 3px;  
    margin: 5px 5px 5px 10px;  
    width: 97%;  
    table-layout: auto;  
    border-collapse: collapse;  
    empty-cells: hide;  
}  
#divTicketHeader  
{  
    padding: 4px;  
    background-color: #C9DAEE;  
    background-repeat: repeat-x;  
    background-position: top;  
    background-image: url('../Images/TicketHeaderBack.png');  
    height: 29px;  
    vertical-align: middle;  
}  
#divTicketSubject  
{  
    display: inline;  
    font-family: Arial, Helvetica, sans-serif;  
    font-size: 14pt;  
    font-weight: bold;  
    font-style: normal;  
    font-variant: normal;  
    text-transform: none;  
    color: #000000;  
    text-align: left;  
}  
#divTicketID  
{  
    display: inline;  
    float: rightright;  
    font-family: Arial, Helvetica, sans-serif;  
    font-size: 14pt;  
    font-weight: bold;  
    color: #2F3F50;  
}  
.TableHeaderLabel  
{  
    font-family: Arial, Helvetica, sans-serif;  
    font-size: 10pt;  
    font-weight: bold;  
    font-style: normal;  
    color: #DCE6F4;  
    text-align: left;  
    padding: 2px;  
}  
.DataContainer  
{  
    font-family: Arial, Helvetica, sans-serif;  
    font-size: 10px;  
    vertical-align: top;  
    background-color: #FFFFFF;  
    padding: 5px;  
}  
#divProblemDescriptionContainer  
{  
    border: 1px solid #2F3F50;  
    padding: 5px;  
    margin: 8px;  
    background-color: #4F6379;  
}  
#divProblemDescription  
{  
    padding: 4px;  
    border: 1px solid #2F3F50;  
    background-color: #FFFFFF;  
}  
.InternalTable  
{  
    border-collapse: collapse;  
    empty-cells: show;  
    width: 98%;  
    margin: 3px;  
}  
#divStatusUpdatePanel  
{  
    position: absolute;  
    z-index: 5000;  
    width: 300px;  
    top: 35px;  
    rightright: 2px;  
    background-color: #C9DAEE;  
    background-image: url('../Images/TicketHeaderBack.png');  
    background-repeat: repeat-x;  
    background-position: top;  
    border: 1px solid #7991A9;  
    font-family: Arial, Helvetica, sans-serif;  
    color: #2F3F50;  
    font-size: 12pt;  
    font-weight: bold;  
    text-align: center;  
    vertical-align: middle;  
    display: none;  
    padding: 5px;  
}  
 
.SWBTS_HistoryEntry  
{  
    padding: 4px;  
    background-color: #C9DAEE;  
    border-collapse: collapse;  
    border-style: solid;  
    border-width: 1px;  
    border-color: #7991A9;  
    width: 100%;  
}  
.SWBTS_HistoryHeader  
{  
    background-image: url('../Images/TicketHeaderBack.png');  
    background-repeat: repeat-x;  
    background-position: top;  
    border-bottom: 2px solid #7991A9;  
    border-collapse: separate;  
}  
.SWBTS_HistoryEntry .NoteText  
{  
    border: 1px solid #7991A9;  
    padding: 8px;  
    background: #ffffff;  
}  
.SWBTS_HistoryEntry .Label  
{  
    font-weight: bold;  
}  
.SWBTS_HistoryEntry .Data  
{  
    font-weight: normal;  
    padding-left: 8px;  
}  
.TicketHistoryControlBar  
{  
    font-family: Arial, Helvetica, sans-serif;  
    font-size: 10pt;  
    color: #4F6379;  
    text-align: rightright;  
} 

And the code-behind that is relevant to the problem:
    Private Sub SetLastExecutedCommand(ByVal text As String)  
        ScriptManager.RegisterStartupScript(Me, Page.GetType, "ShowMessage", "showStatusPanel('" & text & "');", True)  
    End Sub 
 
    Protected Sub tbTicketDetails_ButtonClick(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadToolBarEventArgs) Handles tbTicketDetails.ButtonClick  
        If e.Item.GetType Is GetType(UI.RadToolBarButton) Then 
            Dim button As UI.RadToolBarButton = DirectCast(e.Item, UI.RadToolBarButton)  
            Select Case button.CommandName  
                Case "ClaimTicket" 
                    RaiseEvent ClaimTicket(Me, EventArgs.Empty)  
                    SetLastExecutedCommand("You have claimed this ticket")  
                Case "ReleaseTicket" 
                    RaiseEvent ReleaseTicket(Me, EventArgs.Empty)  
                    SetLastExecutedCommand("You have released this ticket")  
                Case "DeleteTicket" 
                    RaiseEvent DeleteTicket(Me, EventArgs.Empty)  
                    SetLastExecutedCommand("The ticket has been deleted from the system")  
                Case "RestoreTicket" 
                    RaiseEvent RestoreTicket(Me, EventArgs.Empty)  
                    SetLastExecutedCommand("The ticket has been restored")  
                Case "LockTicket" 
                    RaiseEvent LockTicket(Me, EventArgs.Empty)  
                    SetLastExecutedCommand("Ticket Locked - You are the only person able to edit this ticket.")  
                Case "UnlockTicket" 
                    RaiseEvent UnlockTicket(Me, EventArgs.Empty)  
                    SetLastExecutedCommand("Ticket Unlocked - Anyone can edit this ticket.")  
                Case "AddNotes" 
                    ramControlManager.Redirect("NoteEditor.aspx?TID=" & _ticketID & "&MD=E")  
                Case "MoveTicket" 
                    ramControlManager.Redirect("NoteEditor.aspx?TID=" & _ticketID & "&MD=M")  
                Case "AssignTicket" 
                    ramControlManager.Redirect("NoteEditor.aspx?TID=" & _ticketID & "&MD=A")  
                Case "AssignGoal" 
                    winAccreditationView.NavigateUrl = "UpdateAccreditationGoal.aspx?TID=" & _ticketID  
                    winAccreditationView.VisibleOnPageLoad = True 
            End Select 
            RaiseEvent LoadTicketDetails(Me, EventArgs.Empty)  
            RaiseEvent LoadHistory(Me, EventArgs.Empty)  
            SetDetailsUI()  
        End If 
    End Sub 
 

Again, I apologize for the amount of code, but perhaps I'm just overlooking something on the page.

Thanks,
Chris

8 Answers, 1 is accepted

Sort by
0
Eric
Top achievements
Rank 1
answered on 05 May 2009, 02:18 PM
Chris,

I have a similar problem but I have a relatively simpler page... so that may eliminates a few options.

At the top, I have RadWindowManager, RadScriptManager and RadAjaxManager.
Then a HTML table (width 100%) containing a few combo boxes used as filters for a Grid that appears underneath the table.

Like you the page is fine initially but I have an empty space appearing on top of everything if I fire an Ajax request.

I manage to "limit the damage" by surrounding my RadWindowManager, RadScriptManager and RadAjaxManager in a <div style="height:0px; width: 0px;">.
This seems to halve the amount of wasted space.

Another interestiong detail is that everything looks perfect in Firefox 3.0. I only have this problem with IE 7.
These are the only two browsers I use.

Any idea anyone?

Thanks


Eric
0
Chris
Top achievements
Rank 1
answered on 06 May 2009, 02:00 PM
I had a few hidden fields that were inline at the top of the form area. I moved them from right after the form opening tag to just prior to the closing form tag.

Before:
<form id="form1" runat="server">  
     <asp:HiddenField ID="fieldTicketID" runat="server"/>  
     <asp:HiddenField ID="fieldCurrentUser" runat="server"/>  
 
     <!-- REMAINING PAGE CONTENTS ---> 
 
</form> 

After:
<form id="form1" runat="server">  
 
     <!-- REMAINING PAGE CONTENTS ---> 
 
     <asp:HiddenField ID="fieldTicketID" runat="server"/>  
     <asp:HiddenField ID="fieldCurrentUser" runat="server"/>  
</form> 

This seems to have corrected the problem. Do you have any hidden fields in your page?
0
Eric
Top achievements
Rank 1
answered on 06 May 2009, 02:12 PM
Yes I do but I tried to hide them in a Div with height and width set to 0px.

    <form id="form1" runat="server"> 
    <div> 
        <div  id="toto" style="height:0px; width: 0px;"> 
            <asp:HiddenField ID="txtNodeKey" runat="server" /> 
            <asp:HiddenField ID="txtShowFVOptions" runat="server" Value="1" /> 
            <telerik:RadWindowManager ID="RadWindowManager1" runat="server" /> 
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server" /> 
            <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> 
                <AjaxSettings> 
                    <telerik:AjaxSetting AjaxControlID="txtPropertyDescFilter"> 
                        <UpdatedControls> 
                            <telerik:AjaxUpdatedControl ControlID="RadGridAttributes" /> 
                        </UpdatedControls> 
                    </telerik:AjaxSetting> 
... 
                </AjaxSettings> 
            </telerik:RadAjaxManager> 
        </div> 
        <uc2:DisplayError ID="DisplayError1" runat="server" /> 
        <div id="divFilterOptions" runat="server"> 
            <table width="100%" style="border-style: solid; border-width: thin"> 
                <tr> 
                    <td> 
                        &nbsp;Type: 
                        <telerik:RadTextBox ID="txtPropertyDescFilter" runat="server" Wrap="False" AutoPostBack="True" 
                            Width="75px" OnTextChanged="txtPropertyDescFilter_TextChanged" /> 
                    </td> 
                    <td> 
etc... 

This seemed to work in another case.
I suspect it hides some of the trouble but more may be coming from somewhere else...

Spooky...
0
Chris
Top achievements
Rank 1
answered on 06 May 2009, 02:15 PM
Maybe you could try an absolutely positioned div and place it outside of the "render" area.

        <div  id="toto" style="height:0px; width: 0px; position: absolute: top: -100px">   
            <asp:HiddenField ID="txtNodeKey" runat="server" />   
            <asp:HiddenField ID="txtShowFVOptions" runat="server" Value="1" />   
            <telerik:RadWindowManager ID="RadWindowManager1" runat="server" />   
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />   
            <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">   
                <AjaxSettings>   
                    <telerik:AjaxSetting AjaxControlID="txtPropertyDescFilter">   
                        <UpdatedControls>   
                            <telerik:AjaxUpdatedControl ControlID="RadGridAttributes" />   
                        </UpdatedControls>   
                    </telerik:AjaxSetting>   
...   
                </AjaxSettings>   
            </telerik:RadAjaxManager>   
        </div>   
 
0
Eric
Top achievements
Rank 1
answered on 06 May 2009, 02:21 PM
Tried it. No difference...
0
Naresh
Top achievements
Rank 1
answered on 15 May 2009, 01:32 PM
Chris,

Moving the Div off screen worked for me. Thanks for the tip!

Brian
0
Chris
Top achievements
Rank 1
answered on 15 May 2009, 04:02 PM
Brian,

Glad I could help!

Chris
0
Eric
Top achievements
Rank 1
answered on 04 Jun 2009, 10:16 AM
For the record, my problem was that I had a User Control in the page with its own Ajax Update panel and I did not surround it with an "invisible div".
This was why I initially only solved half my problem...
Tags
Ajax
Asked by
Chris
Top achievements
Rank 1
Answers by
Eric
Top achievements
Rank 1
Chris
Top achievements
Rank 1
Naresh
Top achievements
Rank 1
Share this question
or