Hi,
I am new to Telerik controls. I recently started using these controls.
I have a situation where user select a file and click on the button then I want to show ajax loading image on the panel below that button.
also i want to update panel content with filename.
I tried this example but no use
http://demos.telerik.com/aspnet-ajax/ajax/examples/loadingpanel/loadingimages/defaultcs.aspx
My telerik controls version is : 2012.2.607.40
This is my sample working code.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="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
>
<
style
type
=
"text/css"
>
.module1
{
background-color: #dff3ff;
border: 1px solid #c6e1f2;
}
/*Hide RadEditor toolbars*/
.Default .reToolbarWrapper
{
display: none;
}
</
style
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
runat
=
"server"
ID
=
"RadScriptManager1"
/>
<
telerik:RadAjaxManager
ID
=
"RadAjaxManager1"
runat
=
"server"
>
<
AjaxSettings
>
<
telerik:AjaxSetting
AjaxControlID
=
"Panel1"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"Panel1"
LoadingPanelID
=
"RadAjaxLoadingPanel1"
>
</
telerik:AjaxUpdatedControl
>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
</
AjaxSettings
>
</
telerik:RadAjaxManager
>
<
asp:FileUpload
ID
=
"fileUpload"
runat
=
"server"
/>
<
asp:Button
ID
=
"Button1"
runat
=
"server"
Text
=
"Click to see the loading image"
OnClick
=
"Button1_Click"
>
</
asp:Button
>
<
asp:Label
ID
=
"lblTop"
runat
=
"server"
/>
<
br
/>
<
br
/>
<
fieldset
class
=
"module1"
>
<
asp:Panel
ID
=
"Panel1"
runat
=
"server"
HorizontalAlign
=
"Center"
Height
=
"275px"
Style="padding-top: 15px;
padding-left: 15px">
<
telerik:RadEditor
ID
=
"importLogEditor"
runat
=
"server"
EditModes
=
"Design"
Enabled
=
"true"
Width
=
"410px"
Height
=
"190px"
>
<
Tools
>
<
telerik:EditorToolGroup
>
</
telerik:EditorToolGroup
>
</
Tools
>
<
Content
>
</
Content
>
</
telerik:RadEditor
>
</
asp:Panel
>
</
fieldset
>
<
telerik:RadAjaxLoadingPanel
ID
=
"RadAjaxLoadingPanel1"
runat
=
"server"
>
</
telerik:RadAjaxLoadingPanel
>
</
form
>
</
body
>
</
html
>
and this is my code behind file
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;
using
Telerik.Web.UI;
public
partial
class
_Default : System.Web.UI.Page
{
/******* READ: What I want? *************/
//When the user selects a file and clicks on the button then
//I want to update only Panel content, not entire page.
//How to do that?
//Also I am unable to see Ajax loading image as appeared in the below link
/*******************************************/
protected
void
Button1_Click(
object
sender, EventArgs e)
{
//This lable is outside update panel. It should not update
lblTop.Text = DateTime.Now.Ticks.ToString();
//when button is clicked I want to update only this part
System.Threading.Thread.Sleep(2000);
importLogEditor.Content = fileUpload.FileName;
importLogEditor.Content +=
"</br>"
+ DateTime.Now.Ticks.ToString();
}
}
Thank you.