This is a migrated thread and some comments may be shown as answers.

Blank line in IE when all controls are not visible

7 Answers 133 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
Afonso Mendes
Top achievements
Rank 1
Afonso Mendes asked on 05 Sep 2007, 09:00 AM
Hello,
in my project I have one container that can host several controls but only one is visible at a time.

If all the controls in the container are not visible a blank line persist. This only happens in IE.

It seems to me that the Panel added by the manager adds a blank line that the IE renders.

Best regards.

Here is an example illustrating the problem.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 
<%@ Register Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" TagPrefix="telerik" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title>Untitled Page</title> 
</head> 
<body> 
    <script type="text/javascript">  
        function ResponseEnd()  
        {  
              
        }  
    </script> 
    <form id="form1" runat="server">  
        <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
        <telerik:RadAjaxManager ID="RadAjaxManager" runat="server" ClientEvents-OnResponseEnd="ResponseEnd()" /> 
        <div id="MasterDiv" style="height: 200px; width: 200px; border: solid 2px black;">  
            <div id="Div1" runat="server" visible="true" style="width: 200px; height: 200px; background-color: Gray;">  
            </div> 
            <div id="Div2" runat="server" visible="false" style="width: 200px; height: 200px; background-color: Teal;">  
            </div> 
        </div> 
        <asp:Button ID="btn" OnClick="btn_OnClick" runat="server" Text="Toggle Panel" /> 
    </form> 
</body> 
</html> 
using System;  
using System.Data;  
using System.Configuration;  
using System.Web;  
using System.Web.Security;  
using System.Web.UI;  
using System.Web.UI.WebControls;  
using System.Web.UI.WebControls.WebParts;  
using System.Web.UI.HtmlControls;  
 
public partial class _Default : System.Web.UI.Page   
{  
    protected void Page_Load(object sender, EventArgs e)  
    {  
        RadAjaxManager.AjaxSettings.AddAjaxSetting(btn, Div1);  
        RadAjaxManager.AjaxSettings.AddAjaxSetting(btn, Div2);  
    }  
 
    protected void btn_OnClick(Object sender, EventArgs e)  
    {  
        if (Div2.Visible)  
        {  
            Div2.Visible = false;  
            Div1.Visible = true;  
        }  
        else  
        {  
            Div1.Visible = false;  
            Div2.Visible = true;  
        }  
    }  

7 Answers, 1 is accepted

Sort by
0
Steve
Telerik team
answered on 06 Sep 2007, 01:39 PM
Hello Afonso,

Firefox and Opera do not respect the background-color for the divs and that is why the issue is not visible there. It comes from the fact that you have 2 AjaxSettings for the same initiator and controls nested in the same container. Try adding runat="server" to your MasterDiv and add it to the AjaxSettings instead of the inner divs.

Kind regards,
Steve
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Afonso Mendes
Top achievements
Rank 1
answered on 10 Sep 2007, 09:59 AM
Hello Steve, thanks for you answer.
True, this does work in this example. But I only used it to show the blank line.
I'm my project I cannot update the entire panel because I have controls that I don't want to change. The controls have RadGrid and RadTree and for performance reasons I have the viewstate disabled.

I really think this is a bad render issue. Why would a panel with all child controls not visible still render something?

I don't know if you prefer that I open another topic, but I have another question.
I have one callback that doesn't add anything to AjaxSetting, it doesn't update anything in the client, only returns some ResponseScripts.
But if I do this the AjaxManage ceases to run the ClientEvents-OnResponseEnd.
To overcome this problem I have a dummy invisible control that it's always updated.
Is there a better way to do it?

If you want I can send a small example.

Regards.
0
plamen
Top achievements
Rank 1
answered on 12 Sep 2007, 10:55 AM


Please post the code of the problematic page and I will advise you.


Thank you...
[John Peel]
0
Afonso Mendes
Top achievements
Rank 1
answered on 12 Sep 2007, 01:20 PM

Hello John,
here is the example.
If you click on the "Show time" button the alert window in the ClientEvents-OnResponseEnd pops as it should. Clicking on the "Alert time" button shows the alert only one time, subsequent clicks in any button doesn't run the ClientEvents-OnResponseEnd script.

Another thing that I find strange is that the ClientEvents-OnResponseEnd script runs first than the OnResponseScripts. That really doesn't make any sense the ClientEvents-OnResponseEnd script should be the last one.

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" EnableViewState="false" %> 
<%@ Register Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" TagPrefix="telerik" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title>Untitled Page</title> 
</head> 
<body> 
    <script type="text/javascript">  
        function ResponseEnd()  
        {  
            alert("Callback ended");  
        }  
          
        function DoCallback(arg)  
        {  
            <%= RadAjaxManager.ClientID %>.AjaxRequest(arg);  
            return false;  
        }  
    </script> 
    <form id="form1" runat="server">  
        <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
        <telerik:RadAjaxManager ID="RadAjaxManager" runat="server" ClientEvents-OnResponseEnd="ResponseEnd()" /> 
        <asp:Label ID="label" runat="server" /> 
          
        <asp:Button ID="alert" runat="server" OnClientClick="DoCallback('alert'); return false;" Text="Alert time" /> 
        <asp:Button ID="show" runat="server" OnClientClick="DoCallback('show'); return false;" Text="Show time" /> 
    </form> 
</body> 
</html> 
 

Default.aspx.cs
using System;  
using System.Data;  
using System.Configuration;  
using System.Web;  
using System.Web.Security;  
using System.Web.UI;  
using System.Web.UI.WebControls;  
using System.Web.UI.WebControls.WebParts;  
using System.Web.UI.HtmlControls;  
 
public partial class _Default : System.Web.UI.Page   
{  
    protected void Page_Load(object sender, EventArgs e)  
    {  
        if (!Page.IsPostBack)  
        {  
            RadAjaxManager.AjaxSettings.AddAjaxSetting(RadAjaxManager, label);  
        }  
 
        RadAjaxManager.AjaxRequest += new Telerik.Web.UI.RadAjaxControl.AjaxRequestDelegate(RadAjaxManager_AjaxRequest);  
    }  
 
    void RadAjaxManager_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)  
    {  
        switch (e.Argument)  
        {  
            case "show":  
                label.Text = DateTime.Now.ToString();  
                RadAjaxManager.AjaxSettings.AddAjaxSetting(RadAjaxManager, label);  
                break;  
            case "alert":  
                RadAjaxManager.ResponseScripts.Add("alert('" + DateTime.Now.ToString() + "');");  
                break;  
        }  
          
    }  
 

Best regards.
0
Missing User
answered on 14 Sep 2007, 07:34 AM
Hello Afonso and John,


Afonso , thank you very much for pointing this issue, it will be fixed for the next release. Your Telerik points have been updated for the report.


Greetings,
Plamen
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Doug Bass
Top achievements
Rank 1
answered on 09 Oct 2008, 08:41 PM
Was this problem ever resolved?  We are using "RadControls for ASPNET AJAX Q2 2008".  I have an <asp:Panel> control on my page that is being output to the page, even when its Visible property is set to False.  If I remove the Panel control from the UpdatedControls collection of my AjaxSetting in the RadAjaxManager, the Panel is no longer rendered and the problem goes away, but obviously I can no longer update my Panel contents via AJAX.  Sometimes I want to update it, and sometimes I want it to be invisible.  When I make it invisible, a blank line is being rendered instead.
0
Missing User
answered on 13 Oct 2008, 10:04 AM
Hi Doug,



RadAjax cannot update invisible controls. This is discussed in the online help article:

http://www.telerik.com/help/aspnet/ajax/ajxmostcommonmistakes.html



The visibility of controls is best controlled during the ajax request if they are placed inside a control on the page that is always visible. Here are the exact steps:

   1. Place the control in an element which is always visible, such as a Panel, an AJAX Panel or a DIV.
   2. Add this visible control to the AJAX pairs where the AJAX initiator control should update the visible control.
   3. Change the Visible property of the control you want to hide/show.



Best wishes,
Plamen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
Ajax
Asked by
Afonso Mendes
Top achievements
Rank 1
Answers by
Steve
Telerik team
Afonso Mendes
Top achievements
Rank 1
plamen
Top achievements
Rank 1
Missing User
Doug Bass
Top achievements
Rank 1
Share this question
or