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

update panel not displaying in firefox

5 Answers 87 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
kyle goodfriend
Top achievements
Rank 2
kyle goodfriend asked on 28 Sep 2010, 05:21 PM
I have created a very simple page with a button and the ajax compnents.  When I click the button, the update panel doesn't display in firefox but it does in IE.  I took this from one of the examples.  Is there something unique to Firefox?  The example works on the demo page, but when I remove the content code and place it on my page, it doesn't.

Thanks
<%@ Page Language="VB" %>
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<script runat="server">
 
    Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs)
        'simulate longer page load
        System.Threading.Thread.Sleep(2000)
    End Sub
    Protected Sub CheckBox1_CheckedChanged(ByVal sender As Object, ByVal e As EventArgs)
        RadAjaxLoadingPanel1.EnableSkinTransparency = (TryCast(sender, CheckBox)).Checked
    End Sub
    Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As EventArgs)
        Dim position As New AjaxLoadingPanelBackgroundPosition()
        If DropDownList1.SelectedValue = "Bottom" Then
            position = AjaxLoadingPanelBackgroundPosition.Bottom
        End If
        If DropDownList1.SelectedValue = "BottomLeft" Then
            position = AjaxLoadingPanelBackgroundPosition.BottomLeft
        End If
        If DropDownList1.SelectedValue = "BottomRight" Then
            position = AjaxLoadingPanelBackgroundPosition.BottomRight
        End If
        If DropDownList1.SelectedValue = "Center" Then
            position = AjaxLoadingPanelBackgroundPosition.Center
        End If
        If DropDownList1.SelectedValue = "Left" Then
            position = AjaxLoadingPanelBackgroundPosition.Left
        End If
        If DropDownList1.SelectedValue = "None" Then
            position = AjaxLoadingPanelBackgroundPosition.None
        End If
        If DropDownList1.SelectedValue = "Right" Then
            position = AjaxLoadingPanelBackgroundPosition.Right
        End If
        If DropDownList1.SelectedValue = "Top" Then
            position = AjaxLoadingPanelBackgroundPosition.Top
        End If
        If DropDownList1.SelectedValue = "TopLeft" Then
            position = AjaxLoadingPanelBackgroundPosition.TopLeft
        End If
        If DropDownList1.SelectedValue = "TopRight" Then
            position = AjaxLoadingPanelBackgroundPosition.TopRight
        End If
        RadAjaxLoadingPanel1.BackgroundPosition = position
    End Sub
</script>
 
<head runat="server">
    <title></title>
    <style type="text/css">
        .style1
        {
            width: 212px;
            height: 65px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <telerik:RadScriptManager ID="ScriptManager1" runat="server" />
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="CheckBox1">
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="DropDownList1">
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="Panel1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="Panel1"
                        LoadingPanelID="RadAjaxLoadingPanel1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <div class="bigModule">
        <div class="bigModuleBottom">
            <p>
                <b>RadAjaxLoadingPanel</b> supports skinning and you can change its skin by setting
                the <b>Skin</b> property to the name of the respective skin. A <b>BackgroundPosition</b>
                property enables you to position the loading image in the loading panel. The <b>EnableSkinTransparency</b>
                property allows you to enable/disable default skin transparency.</p>
            <p>
                Please note that the loading images that are currently embedded in the Telerik.Web.UI
                assembly will not be available after Q1 2009.
            </p>
            <br />
        </div>
    </div>
 
        <table>
            <tr>
                <td style="width: 200px">
<asp:CheckBox ID="CheckBox1" runat="server" Text="EnableSkinTransparency" Checked="true"
AutoPostBack="true" OnCheckedChanged="CheckBox1_CheckedChanged" /><br />
                    <br />
                </td>
                <td>
                    Change Background Position:<br />
                    <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
                        <asp:ListItem>Bottom</asp:ListItem>
                        <asp:ListItem>BottomLeft</asp:ListItem>
                        <asp:ListItem>BottomRight</asp:ListItem>
                        <asp:ListItem Selected="True">Center</asp:ListItem>
                        <asp:ListItem>Left</asp:ListItem>
                        <asp:ListItem>None</asp:ListItem>
                        <asp:ListItem>Right</asp:ListItem>
                        <asp:ListItem>Top</asp:ListItem>
                        <asp:ListItem>TopLeft</asp:ListItem>
                        <asp:ListItem>TopRight</asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
        </table>
 
    <fieldset class="module1">
        <asp:Panel ID="Panel1" runat="server" HorizontalAlign="Center" Height="275px">
<asp:Button ID="Button1" runat="server" Text="Click to see the loading image" OnClick="Button1_Click"
Style="margin-top: 15px; margin-left: 15px" CssClass="qsfButtonBigger" />
        </asp:Panel>
    </fieldset>
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">
adfadsfadsfasdfadsfadfas
    </telerik:RadAjaxLoadingPanel>
    </form>
</body>
</html>

5 Answers, 1 is accepted

Sort by
0
Cori
Top achievements
Rank 2
answered on 28 Sep 2010, 06:31 PM
Hello Kyle,

Remove the text content from the RadAjaxLoadingPanel control and see if that works.
0
kyle goodfriend
Top achievements
Rank 2
answered on 28 Sep 2010, 08:18 PM
No change.  I tried creating one one my own first, fyi.  It didn't work, which is when I copied from the demo page.  Could you supply a simple example? I did this real quick.  It works in IE, not FireFox.

<%@ Page Language="VB" %>
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<script runat="server">
 
</script>
 
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    </telerik:RadScriptManager>
    <div>
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="Button1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="Button1"
                            LoadingPanelID="RadAjaxLoadingPanel1" UpdatePanelHeight="" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>  
    </div>
    <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" height="200px"
        width="300px">
        <asp:Button ID="Button1" runat="server" Text="Button" />
    </telerik:RadAjaxPanel>
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Runat="server"
        MinDisplayTime="1000" Skin="Default">
        Test
    </telerik:RadAjaxLoadingPanel>
    </form>
</body>
</html>
0
Cori
Top achievements
Rank 2
answered on 28 Sep 2010, 09:52 PM

In your RadAjaxLoadingPanel, you should remove Test from it. It should look like this:

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Runat="server"
        MinDisplayTime="1000" Skin="Default">
</telerik:RadAjaxLoadingPanel>

See if that works. If it does, then it means you can't add text inside the RadAjaxLoadingPanel control.

I hope that helps.
0
kyle goodfriend
Top achievements
Rank 2
answered on 28 Sep 2010, 10:28 PM
Doesn't work.  I have tried that, tried adding a gif, tried setting the skin...nothing works in FireFox, but everything works in IE.  There has to be something very basic I am missing.
0
Cori
Top achievements
Rank 2
answered on 29 Sep 2010, 02:53 PM
Remove your button from inside the RadAjaxPanel. You're not supposed to have RadAjaxPanel and RadAjaxManager on the same page.

See if that helps.
Tags
Ajax
Asked by
kyle goodfriend
Top achievements
Rank 2
Answers by
Cori
Top achievements
Rank 2
kyle goodfriend
Top achievements
Rank 2
Share this question
or