Questions on UI for ASP.NET AJAX Forum

1 answer

56 views

The ToolTip Demo doesn't work after I imported the demo files. I've found out that the problem comes up with strong names:

http://joel.neubeck.net/2007/03/loading-custom-web-control-from-an-aspx-code-behind-page/

This Line don't work, because the given type is not: AppointmentToolTip instead it is ASP.AppointmentToolTip_ascx

AppointmentToolTip

toolTip = (AppointmentToolTip)LoadControl("AppointmentToolTip.ascx");

Even to add ClassName or changing the Reference Tag to Register, doesen't work.

<%

@ Register src="AppointmentToolTip.ascx" TagName="AppointmentToolTip" TagPrefix="ptc" %>

Grid

answered on 17 Jun 2009

1 answer

83 views

MINIMIZING THE RAD GRID TODISPLAY AS AN(LOOK LIKE) HORIZONTAL RULER WHEN IT CONTAINS NO DATA

Hi folks !

Im using the RAD GRID from ASP.NET AJAX UI Controls.

Iam using the GRAY SKIN for the above mentioned GRID.

Actually, I want to display my Rad Grid show like an HORIZONTAL RULER when it containd no data. (i.e. RAD GRID should not display the COULMN HEADERS even if contains no data.)

I dont know you guys are getting me or not. ?

Guys,

I hope you are getting me,

Let me give you an another exapmle :-

I have an ASPX Page that display the RAD GRID(with GRAY SKIN) , this RAD GRID is connected to the OBJECT DATASOURCE. At the first instanace , RAD GRID contains two or three columns (i.e. COLUMN HEADERS).

Now here my problem comes , I want these RAD GRID COLUMN HEADERS not to be visible until or unless I hit the SHOW GRID/ANY BUTTON to show the RAD GRID at its fullest with data being displayed.

Or in the simpler words , I want to have my grid look like the HORIZONTAL RULER when it do not have any records to display.

If you guys want me to give you an screen shot, I will surely provide it to you.

Please provide me the much needed help as you giys have done it before .

Thanks & Regards

Ajay

Grid

answered on 17 Jun 2009

4 answers

189 views

Use of RadEditor causing "Unspecified Error" to AutoCompleteExtender controls

Hello,

We are currently using an AutoCompleteExtender and a RadEditor in our page. Unfortunately, whenever we put in the RadEditor, the AutoCompleteExtender

throws an error everytime the user selects an option within its drop down list (using a single mouse click). When we remove the RadEditor from the page, users are again able

to select an option from the autocompleteextender dropdown list without any errors. When we tried debugging the error we get an 'Unspecified Error'

that can be traced to a certain getClientRects function. Would you have any ideas why the RadEditor appears to cause an error on the

AutoCompleteExtender? Are there any problems that may result from using AjaxToolkit AutoCompleteExtender and your RadEditor?

    
            <telerik:RadAjaxPanel runat="server" id="rpnlProfileIntroduction"> 
        
                <table style="width: 750px" cellpadding="0" cellspacing="0" onmouseover="ShowEditButtonProfileIntroduction(true)" onmouseout="ShowEditButtonProfileIntroduction(false)"> 
        
                    <tr id="trEditProfileIntroduction" runat="server"> 
        
                        <td style="width: 250px;" valign="top"> 
        
                            <table cellspacing="1" cellpadding="0" width="350">        
        
                                <tr> 
        
                                    <td class="ms-ppPropertyLabel" style="width: 120px"> 
        
                                        Current Client: 
        
                                    </td> 
        
                                    <td valign="top" class="ms-ppRedirectLinks" > 
        
                                        <asp:TextBox ID="txtCurrentClient" runat="server" width="200px"></asp:TextBox> 
        
                                        <ajaxToolkit:AutoCompleteExtender 
        
                                            runat="server" 
        
                                            ID="autoCompleteCurrentClient" 
        
                                            TargetControlID="txtCurrentClient"          
        
                                            ServiceMethod="GetCompletionList" 
        
                                            MinimumPrefixLength="1" 
        
                                            CompletionInterval="1000" 
        
                                            EnableCaching="False" 
        
                                            CompletionSetCount="10" 
        
                                            UseContextKey="True" 
        
                                            ContextKey="CurrentClient" 
        
                                            DelimiterCharacters=" " 
        
                                        /> 
        
                                    </td> 
        
                                </tr> 
        
                                <tr> 
        
                                    <td align="left" class="ms-ppErrorTextDescription" colspan="3" valign="top"> 
        
                                        <asp:RegularExpressionValidator ID="regCurrectClient" ControlToValidate = "txtCurrentClient" runat="server" ErrorMessage="Semicolon (;) is not a valid character." ValidationExpression="[^;]*" Display="Dynamic"></asp:RegularExpressionValidator> 
        
                                    </td> 
        
                                </tr> 
        
                            </table> 
        
                        </td>        
        
                        <td valign="top"> 
        
                            <table cellpadding="0" width="400" style="word-wrap:break-word"> 
        
                                <tr> 
        
                                    <td style="width:400px; height: 19px;" class="ms-ppPropertyText" id="tdProfessionalBio"> 
        
                                        <telerik:RadEditor ID="radEditProfessionalBio" runat="server" Width="400px" EditModes="Design" Skin="Hay" Height="200px"> 
        
                                            <Tools> 
        
                                                <telerik:EditorToolGroup> 
        
                                                    <telerik:EditorTool Name="Cut" /> 
        
                                                    <telerik:EditorTool Name="Copy" /> 
        
                                                    <telerik:EditorTool Name="Paste" /> 
        
                                                    <telerik:EditorTool Name="Undo" /> 
        
                                                    <telerik:EditorTool Name="Redo" /> 
        
                                                    <telerik:EditorTool Name="FormatStripper" /> 
        
                                                    <telerik:EditorTool Name="InsertTable" /> 
        
                                                    <telerik:EditorTool Name="ToggleTableBorder" /> 
        
                                                    <telerik:EditorTool Name="LinkManager" /> 
        
                                                    <telerik:EditorTool Name="Unlink" /> 
        
                                                    <telerik:EditorTool Name="InsertSymbol" />  
        
                                                </telerik:EditorToolGroup> 
        
                                            </Tools> 
        
                                        </telerik:RadEditor> 
        
                                    </td> 
        
                                </tr> 
        
                                <tr> 
        
                                    <td align="left" class="ms-ppErrorTextDescription" colspan="3" valign="top">                                                                 
        
                                        <asp:RegularExpressionValidator ID="RegExrProfessionalBio" ControlToValidate = "radEditProfessionalBio" runat="server" ErrorMessage="The bio is too long to fit on My Page.  Please edit your bio." ValidationExpression="[\s\S]{0,3600}" Display="Dynamic"></asp:RegularExpressionValidator> 
        
                                    </td> 
        
                                </tr> 
        
                            </table> 
        
                        </td> 
        
                    </tr> 
        
                <table> 
        
            </telerik:radajaxpanel>

Hoping for your immediate response.

Thanks.

Arthur

Editor

answered on 17 Jun 2009

2 answers

173 views

Empty Message Issues

Run this page ...

    
            <html xmlns="http://www.w3.org/1999/xhtml" > 
        
            <head runat="server"> 
        
                <title></title> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> 
        
                </telerik:RadScriptManager> 
        
                <div> 
        
                  <telerik:RadTextBox ID="RadTextBox1" runat="server" EmptyMessage="Drag text on to me"> 
        
                  </telerik:RadTextBox><asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> 
        
                  <br /> 
        
                  <telerik:RadTextBox ID="RadTextBox2" runat="server" TextMode="Password" EmptyMessage="Enter Password"> 
        
                  </telerik:RadTextBox><asp:Label ID="Label2" runat="server" Text="Label"></asp:Label> 
        
                  <br /> 
        
                  <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" /> 
        
                </div> 
        
                </form> 
        
            </body> 
        
            </html>

    
                    protected void Button1_Click(object sender, EventArgs e) 
        
                    { 
        
                        Label1.Text = RadTextBox1.Text; 
        
                        Label2.Text = RadTextBox2.Text; 
        
                    }

First of all, you will see that the password box appears to have a value, although clicking on the button will show that it doesn't.

Drag some text on to the 1st textbox. I dragged the url for this page out of the Location bar of FF on to the textbox on my page. Pressing the button, you would expect to see "http://www.telerik.com/community/forums/new-thread.aspx?forumId=243". What I actually get is "Drag text on to mehttp://www.telerik.com/community/forums/new-thread.aspx?forumId=243 ".

I'm fairly sure you can't do anything about the first of these 2 issues. I suspect the 2nd is a bug you could fix.

--
Stuart

Input

answered on 17 Jun 2009

4 answers

139 views

Flicker when updating two RadCharts

Hi,
I need to place two RadCharts on same page and they have to be updated with the same event. When the update gets triggered by RadAjaxManager, the second defined graph in AjaxUpdateControl always flickers. Here is the example code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="GraphFlicker.aspx.cs" Inherits="Application_Test_GraphFlicker" %>

<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>

<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Charting" tagPrefix="telerik" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

function pageLoad() {

}

</script>

</head>

<body>

<asp:ScriptManager ID="ScriptManager1" runat="server" />

<asp:Button runat="server" ID="btn1" Text="Test" />

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<telerik:AjaxSetting AjaxControlID="btn1">

<telerik:AjaxUpdatedControl ControlID="btn1" LoadingPanelID="LoadingPanel" />

<telerik:AjaxUpdatedControl ControlID="RadChart1" LoadingPanelID="LoadingPanel" />

<telerik:AjaxUpdatedControl ControlID="RadChart2" LoadingPanelID="LoadingPanel" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="LoadingPanel" runat="server" Skin="Vista" />

<telerik:RadChart ID="RadChart1" runat="server" SkinsOverrideStyles="false" Width="240px" Height="400px" ChartTitle-TextBlock-Text="Chart" ChartTitle-Appearance-Visible="false">

</XAxis>

</YAxis>

</YAxis2>

</PlotArea>

<telerik:ChartSeries Name="Series 1" Type="Pie" Appearance-ShowLabels="true" Appearance-LegendDisplayMode="Nothing" >

<Items>

<telerik:ChartSeriesItem YValue="60" Name="F" Label-TextBlock-Text="F #%" ></telerik:ChartSeriesItem>

<telerik:ChartSeriesItem YValue="20" Name="P" Label-TextBlock-Text="P #%" Label-Appearance-Visible="true"></telerik:ChartSeriesItem>

<telerik:ChartSeriesItem YValue="20" Name="C" Label-TextBlock-Text="C #%" ></telerik:ChartSeriesItem>

</Items>

</telerik:ChartSeries>

</Series>

</telerik:RadChart>

<telerik:RadChart ID="RadChart2" runat="server" SkinsOverrideStyles="false" Width="240px" Height="400px" ChartTitle-TextBlock-Text="Chart" ChartTitle-Appearance-Visible="false">

</XAxis>

</YAxis>

</YAxis2>

</PlotArea>

<telerik:ChartSeries Name="Series 1" Type="Pie" Appearance-ShowLabels="true" Appearance-LegendDisplayMode="Nothing" >

<Items>

<telerik:ChartSeriesItem YValue="60" Name="F" Label-TextBlock-Text="F #%" ></telerik:ChartSeriesItem>

<telerik:ChartSeriesItem YValue="20" Name="P" Label-TextBlock-Text="P #%" Label-Appearance-Visible="true"></telerik:ChartSeriesItem>

<telerik:ChartSeriesItem YValue="20" Name="C" Label-TextBlock-Text="C #%" ></telerik:ChartSeriesItem>

</Items>

</telerik:ChartSeries>

</Series>

</telerik:RadChart>

</form>

</body>

</html>

If I replace the two graphs with asp:Panel, they work as expected, no flicker at all:

<asp:Panel ID="RadChart1" runat="server" Width="240px" Height="400px" BackColor="Red">
</asp:Panel>

<asp:Panel ID="RadChart2" runat="server" Width="240px" Height="400px" BackColor="Blue">
</asp:Panel>

Thanks,

Teo

Ajax

answered on 17 Jun 2009

5 answers

221 views

Change in Radupload Input box width is not reflected in Firefox

Hi,

If you increase the width of the file upload “Rad control” Input box.

The increases in the width is not reflected in Firefox and safari.

Thanks & regards,
Sandesh Mahadik.

Upload (Obsolete)

answered on 17 Jun 2009

4 answers

286 views

Remove Border of Splitter Control

Dear All,

I dont want to show border of rad splitter control.
Does anyone know how to remove, please tell me..

Thanks in advance..

Regards
Brijendra Pandey

Slider

answered on 17 Jun 2009

3 answers

237 views

[Solved] Saving Dock's positions when moved

I'm trying to create a "Widget Portal" for an existing website.

I've used the example and customized it a bit which has lead to the following result:

                    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>         
            <asp:UpdatePanel runat="server" ID="UpdatePanel2">         
                <ContentTemplate>         
                    <telerik:RadDockLayout runat="server" ID="RadDockLayout1" EnableEmbeddedSkins="false" Skin="Telerik"          
                        OnSaveDockLayout="RadDockLayout1_SaveDockLayout" OnLoadDockLayout="RadDockLayout1_LoadDockLayout">         
                            <table cellspacing="5" cellpadding="5" width="100%">         
                                <tr>         
                                    <td style="width: 50%;">         
                                        <telerik:RadDockZone runat="server" ID="Column1" Orientation="vertical" FitDocks="true" EnableEmbeddedScripts="true"          
                                        Style="border: 0px;width: 99%;" Skin="Telerik" >         
                                        </telerik:RadDockZone>         
                                    </td>         
                                    <td style="width: 50%;">         
                                        <telerik:RadDockZone runat="server" ID="Column2" Orientation="vertical" FitDocks="true" EnableEmbeddedScripts="true"          
                                        Style="border: 0px;width: 99%;" Skin="Telerik">         
                                        </telerik:RadDockZone>         
                                    </td>         
                                </tr>         
                            </table>         
                    </telerik:RadDockLayout>         
                </ContentTemplate>         
                <Triggers>         
                    <asp:AsyncPostBackTrigger ControlID="ButtonAddDock" EventName="Click" />         
                </Triggers>         
            </asp:UpdatePanel>         
            <div style="width: 0px; height: 0px; overflow: hidden; position: absolute; left: -10000px;">         
                Hidden UpdatePanel, which is used to help with saving state when minimizing, moving         
                and closing docks. This way the docks state is saved faster (no need to update the         
                docking zones).         
                <asp:UpdatePanel runat="server" ID="UpdatePanel1">         
                </asp:UpdatePanel>         
            </div>         
            <asp:Button runat="server" ID="ButtonAddDock" Text="Widget Toevoegen" OnClick="ButtonAddDock_Click" />         
            <asp:DropDownList ID="DropDownWidget" runat="server" DataSourceID="widgetDataSource" DataTextField="Name" DataValueField="ID"/>         
            <asp:DropDownList ID="DropDownColumn" runat="server" DataSource="<%#GetZones() %>" DataTextField="ID" DataValueField="ClientID"/>         

                    public partial class WidgetPortal : System.Web.UI.UserControl         
                {         
                    WidgetFrameworkHandler wfh = new WidgetFrameworkHandler();         
                     
                    private List<DockState> CurrentDockStates         
                    {         
                        get         
                        {         
                            //Store the info about the added docks in the session. For real life         
                            // applications we recommend using database or other storage medium          
                            // for persisting this information.         
                            List<DockState> _currentDockStates = (List<DockState>)Session["CurrentDockStatesDynamicDocks"];         
                            if (Object.Equals(_currentDockStates, null))         
                            {         
                               // _currentDockStates = CreateDockState();         
                                _currentDockStates = new List<DockState>();         
                                Session["CurrentDockStatesDynamicDocks"] = _currentDockStates;         
                            }         
                            return _currentDockStates;         
                        }         
                        set         
                        {         
                            Session["CurrentDockStatesDynamicDocks"] = value;         
                        }         
                    }         
                     
                    private List<DockState> CreateDockState()         
                    {         
                        List<DockState> returnList = new List<DockState>();         
                        List<PORT_Widget_Instance> widgets = wfh.LoadWidgets();         
                     
                        foreach (PORT_Widget_Instance widget in widgets)         
                        {         
                            DockState ds = new DockState();         
                            ds.Collapsed = widget.Expanded;         
                            ds.DockZoneID = "Column" +widget.Column_;         
                            ds.Title = widget.Title;         
                                     
                            returnList.Add(ds);         
                        }         
                                 
                     
                     
                        return returnList;         
                    }         
                     
                    private RadDock CreateRadDockFromState(DockState state)         
                    {         
                        RadDock dock = new RadDock();         
                        dock.DockMode = DockMode.Docked;         
                        dock.ID = string.Format("RadDock{0}", state.UniqueName);         
                        dock.ApplyState(state); // <-- Deze verneukt het.. is state niet gezet ?         
                      
                        dock.Commands.Add(new DockCloseCommand());         
                        dock.Commands.Add(new DockExpandCollapseCommand());         
                     
                        return dock;         
                    }         
                     
                    private RadDock CreateRadDock()         
                    {         
                        int docksCount = CurrentDockStates.Count;         
                     
                        RadDock dock = new RadDock();         
                        dock.DockMode = DockMode.Docked;         
                        dock.UniqueName = Guid.NewGuid().ToString();         
                        dock.ID = string.Format("RadDock{0}", dock.UniqueName);         
                        dock.Title = "Dock";         
                        dock.Text = string.Format("Added at {0}", DateTime.Now);         
                     
                        dock.Commands.Add(new DockCloseCommand());         
                        dock.Commands.Add(new DockExpandCollapseCommand());         
                     
                        return dock;         
                    }         
                     
                    private void CreateSaveStateTrigger(RadDock dock)         
                    {         
                        //Ensure that the RadDock control will initiate postback         
                        // when its position changes on the client or any of the commands is clicked.         
                        //Using the trigger we will "ajaxify" that postback.         
                        dock.AutoPostBack = true;         
                        dock.CommandsAutoPostBack = true;         
                        dock.AutoPostBack = true;         
                     
                        AsyncPostBackTrigger saveStateTrigger = new AsyncPostBackTrigger();         
                        saveStateTrigger.ControlID = dock.ID;         
                        saveStateTrigger.EventName = "Command";         
                        UpdatePanel1.Triggers.Add(saveStateTrigger);         
                     
                        saveStateTrigger = new AsyncPostBackTrigger();         
                        saveStateTrigger.ControlID = dock.ID;         
                        saveStateTrigger.EventName = "DockPositionChanged";         
                        UpdatePanel1.Triggers.Add(saveStateTrigger);         
                     
                     
                    }         
                     
                     
                    protected void Page_Init(object sender, EventArgs e)         
                    {         
                     
                        //Recreate the docks in order to ensure their proper operation         
                        for (int i = 0; i < CurrentDockStates.Count; i++)         
                        {         
                            RadDock dock = CreateRadDockFromState(CurrentDockStates[i]);         
                            //We will just add the RadDock control to the RadDockLayout.         
                            // You could use any other control for that purpose, just ensure         
                            // that it is inside the RadDockLayout control.         
                            // The RadDockLayout control will automatically move the RadDock         
                            // controls to their corresponding zone in the LoadDockLayout         
                            // event (see below).         
                            RadDockLayout1.Controls.Add(dock);         
                            //We want to save the dock state every time a dock is moved.         
                            CreateSaveStateTrigger(dock);         
                            LoadWidget(dock);         
                        }         
                     
                    }         
                     
                    protected void RadDockLayout1_LoadDockLayout(object sender, DockLayoutEventArgs e)         
                    {         
                        //Populate the event args with the state information. The RadDockLayout control         
                        // will automatically move the docks according that information.         
                        foreach (DockState state in CurrentDockStates)         
                        {         
                            e.Positions[state.UniqueName] = state.DockZoneID;         
                            e.Indices[state.UniqueName] = state.Index;         
                        }         
                    }         
                     
                    protected void RadDockLayout1_SaveDockLayout(object sender, DockLayoutEventArgs e)         
                    {         
                        //Save the dock state in the page Session. This will enable us          
                        // to recreate the dock in the next Page_Init.          
                        CurrentDockStates = RadDockLayout1.GetRegisteredDocksState();         
                    }         
                     
                    protected void ButtonAddDock_Click(object sender, EventArgs e)         
                    {         
                        RadDock dock = CreateRadDock();         
                        RadDockZone dz = (RadDockZone)FindControl(DropDownColumn.SelectedItem.Text);         
                     
                        dz.Controls.Add(dock);         
                        CreateSaveStateTrigger(dock);         
                     
                        dock.Tag = DropDownWidget.SelectedValue;         
                        LoadWidget(dock);         
                    }         
                     
                    private void LoadWidget(RadDock dock)         
                    {         
                        if (string.IsNullOrEmpty(dock.Tag))         
                        {         
                            return;         
                        }         
                        int widgetID = Convert.ToInt32(dock.Tag);         
                        PORT_Widgets wdg = wfh.GetWidget(widgetID);         
                     
                        Control widget = LoadControl("Widgets/" + wdg.Url);         
                        dock.ContentContainer.Controls.Add(widget);         
                    }         
                     
                    public ArrayList GetZones()         
                    {         
                        ArrayList zones = new ArrayList();         
                        zones.Add(Column1);         
                        zones.Add(Column2);         
                     
                        return zones;         
                    }         
                     
                     
                    protected void Page_Load(object sender, EventArgs e)         
                    {         
                        if (!IsPostBack)         
                        {         
                            DropDownColumn.DataBind();         
                        }         
                    }         
                }         

When I add the widgets (with UserControls inside them) it works fine. It also stores it's state.

However when I drag a widget and drop it in a different RadDockZone or within a different place within the same

RadDockZone the state isn't saved and the state that was saved before (the one that was saved when I added a new widget) is reloaded. I think it has something to do with the lifecycle or the time when the layout is supposed to be saved.

So in summary: my problem is the state will not be saved when I drag/drop my widgets this way.. I don't know why.

Could someone please tell me what I'm doing wrong ?

Dock

answered on 17 Jun 2009

2 answers

93 views

RadAjaxPanel causing strange issue

Hi,

I am having the following issue. In my user control i have a RadDatePicker, RadChart & a RadTreeView. Now these are all wrapped in a RadAjaxPanel. All works fine until i drill into the chart. Once i do that i find that the RadTreeView is no longer working (i.e. can't open or collapse the branches). This code was all working in the Q1 2009 release UNTIL i got the LATEST Q1 2009 release. I have replicated the code from my user control into a simple aspx page. Please see below.

Anyone got any ideas or experiencing the same problem??

    
            <%@ Page Language="vb" AutoEventWireup="false" %> 
        
            <%@ Register Assembly="IFMA.Web.UI.Controls" Namespace="IFMA.Web.UI.Controls" TagPrefix="ifma" %> 
        
            <script runat="server">  
        
                Public Sub Page_Load() Handles Me.Load  
        
                    RadTreeView1.LoadXml("<Tree AutoPostBack=""False"" Expanded=""True""><Node Expanded=""False"" Text=""&lt;b&gt;Matching Applications&lt;/b&gt;""> <Node Text=""Application # N0326/03"" ImageUrl=""../../../common/controlImages/masterview.gif"" /></Node></Tree>")  
        
                    lbl1.Text = Now 
        
                    lbl2.Text = Now 
        
                    If Not IsPostBack Then  
        
                        drawChart()  
        
                    End If  
        
                End Sub  
        
                Private Sub drawChart()  
        
                    Dim s0 As ChartSeries  
        
                    s0 = RadChart1.CreateSeries("Oustanding", Drawing.Color.Blue, Drawing.Color.Gold, ChartSeriesType.Pie)  
        
                    Dim seriesItem As ChartSeriesItem  
        
                    seriesItem = New ChartSeriesItem  
        
                    seriesItem.YValue = "23" 
        
                    seriesItem.Name = "item 1" 
        
                    s0.Items.Add(seriesItem)  
        
                    seriesItem = New ChartSeriesItem  
        
                    seriesItem.YValue = "22" 
        
                    seriesItem.Name = "item 2" 
        
                    s0.Items.Add(seriesItem)  
        
                    seriesItem = New ChartSeriesItem  
        
                    seriesItem.YValue = "10" 
        
                    seriesItem.Name = "item 3" 
        
                    s0.Items.Add(seriesItem)  
        
                    seriesItem = New ChartSeriesItem  
        
                    seriesItem.YValue = "40" 
        
                    seriesItem.Name = "item 4" 
        
                    s0.Items.Add(seriesItem)  
        
                    seriesItem = New ChartSeriesItem  
        
                    seriesItem.YValue = "7" 
        
                    seriesItem.Name = "item 5" 
        
                    s0.Items.Add(seriesItem)  
        
                End Sub  
        
                Private Sub RadChart1_Click(ByVal sender As Object, ByVal args As Telerik.Charting.ChartClickEventArgs)  
        
                    'System.Threading.Thread.CurrentThread.Sleep(5000)  
        
                    Dim item As ChartSeriesItem  
        
                    For Each item In args.Series.Items  
        
                        If item.Appearance.Exploded AndAlso (item Is args.SeriesItem) Then  
        
                            'lblResults.Text = item.Label  
        
                        Else  
        
                            item.Appearance.Exploded = False 
        
                        End If  
        
                    Next item  
        
                    If Not args.SeriesItem.Appearance.Exploded Then  
        
                        args.SeriesItem.Appearance.Exploded = True 
        
                        'lblResults.Text += args.SeriesItem.Label              
        
                    End If  
        
                    ''Session("SelectedGraphIndex") = args.SeriesItem.Index  
        
                    'Session("selectedGraphVal") = args.SeriesItem.Name  
        
                    ''lblError.Text = "$" & args.SeriesItem.Name & "$"  
        
                    'displayMatchingResults()  
        
                    'divMatchingApplications.Visible = True 
        
                End Sub  
        
            </script> 
        
            <%@ 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></title>  
        
            </head> 
        
            <body style="background-color:White;">  
        
                <form id="form1" runat="server">  
        
                <asp:ScriptManager ID="ScriptManager1" runat="server">  
        
                </asp:ScriptManager> 
        
                <div> 
        
                    <asp:Label ID="lbl1" runat="server" /> 
        
                    <telerik:RadAjaxPanel ID="Radajaxpanel2" runat="server" LoadingPanelID="RadAjaxLoadingPanel1">  
        
                        <telerik:RadDatePicker ID="dt1" runat="server" /> 
        
                        <asp:Label ID="lbl2" runat="server" /> 
        
                        <telerik:RadChart ID="RadChart1" runat="server" OnClick="RadChart1_Click">  
        
                            <PlotArea> 
        
                                <XAxis MaxValue="5" MinValue="1" Step="1">  
        
                                </XAxis> 
        
                                <YAxis MaxValue="25" Step="5">  
        
                                </YAxis> 
        
                                <YAxis2 MaxValue="5" MinValue="1" Step="1">  
        
                                </YAxis2> 
        
                            </PlotArea> 
        
                        </telerik:RadChart> 
        
                        <br /> 
        
                        <telerik:RadTreeView ID="RadTreeView1" runat="server">  
        
                            <%--<Nodes> 
        
                    <telerik:RadTreeNode Text="1" Expanded=> 
        
                    <Nodes> 
        
                        <telerik:RadTreeNode Text="1a"></telerik:RadTreeNode> 
        
                    </Nodes> 
        
                    </telerik:RadTreeNode> 
        
                    </Nodes>--%> 
        
                        </telerik:RadTreeView> 
        
                    </telerik:RadAjaxPanel> 
        
                    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">  
        
                    </telerik:RadAjaxLoadingPanel> 
        
                </div> 
        
                </form> 
        
            </body> 
        
            </html>

Ajax

answered on 17 Jun 2009

1 answer

139 views

AjaxLoadingPanel + RadGrid + Collapsing Column Group = Javascript Error

Telerik,

I have found that collapsing/expanding a group by column in a RadGrid can cause Javascript Errors when using the AjaxLoadingPanel.

Here is my situation...

I am using the following Javascript to capture the begin and end request to show the Loading Panel (based on the example here):

                        var loadingPanel = "";         
                var pageRequestManager = Sys.WebForms.PageRequestManager.getInstance();         
                var postBackElement = "";         
                pageRequestManager.add_initializeRequest(initializeRequest);         
                pageRequestManager.add_endRequest(endRequest);         
                     
                //Ajax Request         
                function initializeRequest(sender, eventArgs) {         
                    setLoadingPanelStyle($get('<% = RadAjaxLoadingPanel1.ClientID %>'))         
                     
                    loadingPanel = $find('<% = RadAjaxLoadingPanel1.ClientID %>');         
                    postBackElement = eventArgs.get_postBackElement().id;         
                    loadingPanel.show(postBackElement);         
                }         
                     
                //End Ajax Request         
                function endRequest(sender, eventArgs) {         
                    loadingPanel = $find('<% = RadAjaxLoadingPanel1.ClientID %>');         
                    loadingPanel.hide(postBackElement);         
                }         
                     
                     
                //Set Style of loading Panel         
                function setLoadingPanelStyle(ourLoadingPanel) {         
                    ourLoadingPanel.style.height = document.documentElement.scrollHeight + "px";         
                    ourLoadingPanel.style.width = document.documentElement.scrollWidth + "px";         
                    ourLoadingPanel.style.position = "absolute";         
                    ourLoadingPanel.style.top = "0";         
                    ourLoadingPanel.style.left = "0";         
                }         

This javascript works 99% of the time. The one situation it does not work is when the user collapses/expands a grouping by column on the radgrid. In both cases the postBackElement in the initializeRequest and endRequest function end up returning null and throwing a javascript error.

I have modifyied my Javascript to check for null, but the result is that the AjaxLoadingPanel does not show.

Is there anything that I can do to make the AjaxLoadingPanel show up for this situation without modifying this code too terribly?

Thanks,

Thomas M. Porter II

Grid

answered on 17 Jun 2009

	<html xmlns="http://www.w3.org/1999/xhtml" >
	<head runat="server">
	<title></title>
	</head>
	<body>
	<form id="form1" runat="server">
	<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
	</telerik:RadScriptManager>
	<div>
	<telerik:RadTextBox ID="RadTextBox1" runat="server" EmptyMessage="Drag text on to me">
	</telerik:RadTextBox><asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
	<br />
	<telerik:RadTextBox ID="RadTextBox2" runat="server" TextMode="Password" EmptyMessage="Enter Password">
	</telerik:RadTextBox><asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
	<br />

	<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
	</div>
	</form>
	</body>
	</html>

	protected void Button1_Click(object sender, EventArgs e)
	{
	Label1.Text = RadTextBox1.Text;
	Label2.Text = RadTextBox2.Text;
	}