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

Design issue with RadAjaxLoadingPanel in Firefox

12 Answers 93 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
Jyoti
Top achievements
Rank 1
Jyoti asked on 05 Feb 2010, 12:46 PM
Hi,

I am using RadAjaxLoadingPanel.
Their is some design issue with LoadingPanel in firefox.
It is working fine in IE.
When i set LoadingPanel with Grid then it is loaded at the left side of grid rather then in centre.
When i set padding to make centre its position then it will affect in IE .
I also tried with property of Backgroundposition="centre" of RadAjaxLoadingPanel but that not have any affect.
Please help me ASAP.

Thanks in Advance
Regards
Jyoti Khurana

12 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 09 Feb 2010, 12:11 PM
Hello Jyoti,

The BackgroundPosition property applies to the case when you are using RadAjaxLoadingPanel with a skin, which I suspect is not the case - you are using a template, right?

In this case the problem is that are not applying the correct styles, which would center the loading image.

http://www.telerik.com/community/code-library/aspnet-ajax/ajax/how-to-center-image-in-a-radajaxloadingpanel.aspx

Regards,
Dimo
the Telerik team

Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.
0
Basel Nimer
Top achievements
Rank 2
answered on 04 May 2010, 12:04 PM
Hello Dimo,

I have a similar case where the Panel itself shifts, not the image, please see attached.


the code i use is:

    <telerik:RadAjaxLoadingPanel ID="LoginLoading" runat="server" Skin="Hay"  BackColor="red" > 
        <span style="color:Red;">...</span> 
    </telerik:RadAjaxLoadingPanel>   

0
Dimo
Telerik team
answered on 07 May 2010, 12:33 PM
Hello Basel,

This problem is probably caused by some margin or positioning styles applied to the updated control. If you send us simple runnable page, which exhibits the problem, we will investigate the exact cause and provide a workaround.

All the best,
Dimo
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.
0
Basel Nimer
Top achievements
Rank 2
answered on 10 May 2010, 08:06 PM
the Ajax panel only contains a grid (and a script),
  
<telerik:RadAjaxPanel ID="ActionAjax" runat="server" LoadingPanelID="LoginLoading" ClientEvents-OnRequestStart="OnRequestStart">    
 
        <script type="text/javascript"
            function RowSelecting(sender, eventArgs)   
            {    
                var e =  eventArgs.get_domEvent(); 
                var targetElement = e.srcElement || e.target;  
                if(targetElement.tagName.toLowerCase() == "input")  
                {   
                    eventArgs.set_cancel(false); 
                }  
                else 
                {  
                    eventArgs.set_cancel(true); 
                }  
            }   
        </script>            
        <telerik:RadGrid 
                        ID="rgInbox" 
                        Skin="Simple" 
                        ShowFooter="true" 
                        AllowMultiRowSelection="True"  
                        
                        ClientSettings-EnableRowHoverStyle="true"  
                        AutoGenerateColumns="false" 
                        ShowStatusBar="true"  
                        AllowFilteringByColumn="true" 
                        AllowSorting="true" 
                        AllowPaging="true" 
                        PageSize="10"  
                        runat="server" 
                        ShowGroupPanel="True" 
                        > 
 
<!-- SOME COLUMNS GO HERE --> 
        </telerik:RadGrid> 
    </telerik:RadAjaxPanel> 


I forgot to mention, this only happens in FireFox, it works fine in IE.


0
Dimo
Telerik team
answered on 11 May 2010, 02:17 PM
Hello Basel,

The provided code snippet does not exhibit the problem. As suggested earlier, please provide a full runnable web page. Thank you.

Regards,
Dimo
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.
0
Basel Nimer
Top achievements
Rank 2
answered on 16 May 2010, 03:43 PM
ok, is there a way to send you a link in private?

0
Basel Nimer
Top achievements
Rank 2
answered on 16 May 2010, 09:00 PM
I think i found the problem, but not the solution,

I have a master page with the ContentPlaceHolder surrounded by a DIV with padding-left:20px, and inside the page that inherits the master page i have only a gridview and the ajax controls.

this padding is causing a shift left (actually, it is more like ignoring the padding).

i will post a sample next,

0
Basel Nimer
Top achievements
Rank 2
answered on 16 May 2010, 09:18 PM
create a master page with the following code
<%@ Master Language="VB" CodeFile="M1.master.vb" Inherits="M1" %> 
<%@ 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"> 
 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"
    <title>Untitled Page</title> 
    <style type="text/css"
        .UserEditableWithAd 
        { 
            display:table; 
            padding-top :10px; 
            /*padding-right : 20px;*/ 
            padding-bottom: 0px; 
            padding-left: 20px; 
width:100px;
        }     
    </style> 
</head> 
<body> 
    <form id="form1" runat="server"
    <telerik:RadScriptManager id="RadScriptManager1" runat="server"></telerik:RadScriptManager> 
    <div class="UserEditableWithAd"
        <asp:contentplaceholder id="ContentPlaceHolder1" runat="server"
        </asp:contentplaceholder> 
    </div> 
    </form> 
</body> 
</html> 
 

Now create a page that inherits the master page with the following code

<%@ Page Language="VB" MasterPageFile="~/M1.master" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" title="Untitled Page" %> 
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"
 <telerik:RadGrid 
   id="RadGrid1" 
   runat="server" 
> 
 <MasterTableView AutoGenerateColumns="True"  
 AllowSorting="true" /> 
</telerik:RadGrid>  
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default" MinDisplayTime="5000"
    </telerik:RadAjaxLoadingPanel> 
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1"
        <AjaxSettings> 
            <telerik:AjaxSetting AjaxControlID="RadGrid1"
                <UpdatedControls> 
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
            </telerik:AjaxSetting> 
        </AjaxSettings> 
    </telerik:RadAjaxManager> 
</asp:Content> 
 
 


following code is to fill the datagrid with sample data

Imports Telerik.Web.UI 
Partial Class _Default 
    Inherits System.Web.UI.Page 
    Private Sub RadGrid1_NeedDataSource(ByVal [source] As Object, _ 
             ByVal e As GridNeedDataSourceEventArgs) _ 
             Handles RadGrid1.NeedDataSource 
        Dim list As New ArrayList 
        list.Add("string1"
        list.Add("string2"
        list.Add("string3"
        RadGrid1.DataSource = list 
    End Sub 
End Class 
 
run and see








0
Dimo
Telerik team
answered on 17 May 2010, 08:23 AM
Hello Basel,

The problem is caused by the display:table style. Tables and elements with such a display cannot have padding.

Regards,
Dimo
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.
0
Basel Nimer
Top achievements
Rank 2
answered on 17 May 2010, 08:31 AM
so it only appears on FF since FF follows the standards more than IE?

can i ask for a reference to forward to my management?

0
Dimo
Telerik team
answered on 17 May 2010, 08:49 AM
http://www.w3.org/TR/CSS2/box.html#propdef-padding

Regards,
Dimo
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.
0
Basel Nimer
Top achievements
Rank 2
answered on 17 May 2010, 08:54 AM
I thank you

Tags
Ajax
Asked by
Jyoti
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Basel Nimer
Top achievements
Rank 2
Share this question
or