0001：
Accordion控件的使用：折叠面板的控件
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>Accordion控件的使用</title>
<style type="text/css">
/*面板头的样式*/
.accordionHeader
{
border: 1px solid #2F4F4F;
color: white;
background-color: rgb(30%,50%,70%);
font-family: Arial, Sans-Serif;
font-size: 12px;
font-weight: bold;
padding: 5px;
margin-top: 5px;
cursor: pointer;
}
/*面板内容的样式*/
.accordionContent
{
background-color: rgb(50%,70%,90%);
border: 1px dashed #2F4F4F;
border-top: none;
padding: 5px;
padding-top: 10px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<cc1:Accordion
ID="Accordion1"
runat="server"
SelectedIndex="0"
HeaderCssClass="accordionHeader"
ContentCssClass="accordionContent"
FadeTransitions="false"
FramesPerSecond="40"
TransitionDuration="250"
AutoSize="None"
RequireOpenedPane="false"
SuppressHeaderPostbacks="true">
<Panes>
<cc1:AccordionPane ID="AccordionPane1" runat="server">
<Header>第一部分</Header>
<Content>
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA。
</Content>
</cc1:AccordionPane>
<cc1:AccordionPane ID="AccordionPane2" runat="server">
<Header>第二部分</Header>
<Content>
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA。
</Content>
</cc1:AccordionPane>
</Panes>
</cc1:Accordion>
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0002：
AlwaysVisibleControlExtender控件的使用：类似于浮动广告的样子
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>AlwaysVisibleControlExtender控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<cc1:AlwaysVisibleControlExtender
ID="AlwaysVisibleControlExtender1"
runat="server"
TargetControlID="showAlways"
VerticalSide="Top"
VerticalOffset="10"
HorizontalSide="Right"
HorizontalOffset="10"
ScrollEffectDuration=".1">
</cc1:AlwaysVisibleControlExtender>
<asp:Panel runat="server" id="showAlways" BackColor="#C0C0FF" Height="100px" Width="150px"></asp:Panel>
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0003：
AutoCompleteExtender控件的使用：自动完成控件的使用
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>AutoCompleteExtender控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:TextBox ID="TextBox1" runat="server" AutoCompleteType="Office"></asp:TextBox>
<cc1:AutoCompleteExtender
ID="AutoCompleteExtender1"
runat="server"
TargetControlID="TextBox1"
ServicePath="GetData.asmx"
ServiceMethod="GetCompletionList"
MinimumPrefixLength="2"
CompletionInterval="1000"
EnableCaching="true"
CompletionSetCount="5">
</cc1:AutoCompleteExtender>
</form>
</body>
</html>
Web服务部分：GetData.asmx
[System.Web.Script.Services.ScriptService]
public class GetData : System.Web.Services.WebService
{
[WebMethod]
public string[] GetCompletionList(string prefixText, int count)
{
string[] list = new string[count];
for (int i = 0; i < count; i++)
{
list[i] = prefixText + "-------";
}
return list;
}
}
----------------------------------------------------------------------------------------------------
0004：
CascadingDropDown控件的使用：能够实现下拉列表框的联动，这里实现的是区省市的联动
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>CascadingDropDown控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:DropDownList ID="DropDownList1" runat="server"></asp:DropDownList>
<asp:DropDownList ID="DropDownList2" runat="server"></asp:DropDownList>
<asp:DropDownList ID="DropDownList3" runat="server"></asp:DropDownList>
<cc1:CascadingDropDown
ID="CascadingDropDown1"
runat="server"
TargetControlID="DropDownList1"
Category="分区"
PromptText="请选择分区" LoadingText="正在加载..."
ServicePath="GetData.asmx"
ServiceMethod="GetData1" >
</cc1:CascadingDropDown>
<cc1:CascadingDropDown
ID="CascadingDropDown2"
runat="server"
TargetControlID="DropDownList2"
Category="省份"
PromptText="请选择省份"
LoadingText="正在加载..."
ServicePath="GetData.asmx"
ServiceMethod="GetData2"
ParentControlID="DropDownList1" >
</cc1:CascadingDropDown>
<cc1:CascadingDropDown
ID="CascadingDropDown3"
runat="server"
TargetControlID="DropDownList3"
Category="城市"
PromptText="请选择城市"
LoadingText="正在加载..."
ServicePath="GetData.asmx"
ServiceMethod="GetData3"
ParentControlID="DropDownList2" >
</cc1:CascadingDropDown>
</form>
</body>
</html>
Web服务部分：GetData.asmx
[System.Web.Script.Services.ScriptService]
public class GetData : System.Web.Services.WebService
{
[WebMethod]
public AjaxControlToolkit.CascadingDropDownNameValue[] GetData1(string knownCategoryValues, string category)
{
AjaxControlToolkit.CascadingDropDownNameValue[] aList = new AjaxControlToolkit.CascadingDropDownNameValue[2];
aList[0] = new AjaxControlToolkit.CascadingDropDownNameValue("北方", "1");
aList[1] = new AjaxControlToolkit.CascadingDropDownNameValue("南方", "2");
return aList;
}
[WebMethod]
public AjaxControlToolkit.CascadingDropDownNameValue[] GetData2(string knownCategoryValues, string category)
{
System.Collections.Specialized.StringDictionary kv = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
//id1就保存着上一个控件所选择的编码
int id1;
if (kv.ContainsKey("分区") == false || Int32.TryParse(kv["分区"], out id1) == false)
{
return null;
}
AjaxControlToolkit.CascadingDropDownNameValue[] aList = new AjaxControlToolkit.CascadingDropDownNameValue[2];
if (id1 == 1)
{
aList[0] = new AjaxControlToolkit.CascadingDropDownNameValue("河北省", "1");
aList[1] = new AjaxControlToolkit.CascadingDropDownNameValue("山东省", "2");
}
else
{
aList[0] = new AjaxControlToolkit.CascadingDropDownNameValue("广东省", "3");
aList[1] = new AjaxControlToolkit.CascadingDropDownNameValue("广西省", "4");
}
return aList;
}
[WebMethod]
public AjaxControlToolkit.CascadingDropDownNameValue[] GetData3(string knownCategoryValues, string category)
{
System.Collections.Specialized.StringDictionary kv = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
//id1就保存着上一个控件所选择的编码
int id2;
if (kv.ContainsKey("省份") == false || Int32.TryParse(kv["省份"], out id2) == false)
{
return null;
}
AjaxControlToolkit.CascadingDropDownNameValue[] aList = new AjaxControlToolkit.CascadingDropDownNameValue[2];
if (id2 == 1)
{
aList[0] = new AjaxControlToolkit.CascadingDropDownNameValue("三河市", "1");
aList[1] = new AjaxControlToolkit.CascadingDropDownNameValue("廊坊市", "2");
}
else if (id2 == 2)
{
aList[0] = new AjaxControlToolkit.CascadingDropDownNameValue("烟台市", "1");
aList[1] = new AjaxControlToolkit.CascadingDropDownNameValue("淄博市", "2");
}
else if (id2 == 3)
{
aList[0] = new AjaxControlToolkit.CascadingDropDownNameValue("广州市", "1");
aList[1] = new AjaxControlToolkit.CascadingDropDownNameValue("肇庆市", "2");
}
else
{
aList[0] = new AjaxControlToolkit.CascadingDropDownNameValue("柳州市", "1");
aList[1] = new AjaxControlToolkit.CascadingDropDownNameValue("桂林市", "2");
}
return aList;
}
}
----------------------------------------------------------------------------------------------------
0005：
CollapsiblePanelExtender控件的使用：折叠面板
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>CollapsiblePanelExtender控件的使用</title>
<style type="text/css">
.collapsePanel
{
background-color:white;
overflow:hidden;
}
.collapsePanelHeader
{
width:100%;
height:30px;
background-image: url(images/bg-menu-main.png);
background-repeat:repeat-x;
color:#FFF;
font-weight:bold;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:Panel ID="Panel2" runat="server" CssClass="collapsePanelHeader" Height="30px">
<div style="padding:5px; cursor: pointer; vertical-align: middle;">
<div style="float: left;">What is ASP.NET AJAX?</div>
<div style="float: left; margin-left: 20px;">
<asp:Label ID="Label1" runat="server"></asp:Label>
</div>
<div style="float: right; vertical-align: middle;">
<asp:ImageButton
ID="Image1"
runat="server"
ImageUrl="~/images/expand_blue.jpg"/>
</div>
</div>
</asp:Panel>
<asp:Panel ID="Panel1" runat="server" CssClass="collapsePanel" Height="0">
<br />
<p>
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA。
</p>
</asp:Panel>
<cc1:CollapsiblePanelExtender
ID="CollapsiblePanelExtender1"
runat="Server"
TargetControlID="Panel1"
ExpandControlID="Panel2"
CollapseControlID="Panel2"
Collapsed="True"
TextLabelID="Label1"
ImageControlID="Image1"
ExpandedImage="~/images/collapse_blue.jpg"
CollapsedImage="~/images/expand_blue.jpg"
SuppressPostBack="true"/>
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0006：
ConfirmButtonExtender控件的使用：确定提示框的实现，也可以绑定到LinkButton上
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>ConfirmButtonExtender控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:Button ID="Button1" runat="server" Text="Button" />
<cc1:ConfirmButtonExtender
ID="ConfirmButtonExtender1"
runat="server"
TargetControlID="Button1"
ConfirmText="确定么？" >
</cc1:ConfirmButtonExtender>
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0007：
DragPanelExtender控件的使用：拖动面板的实现
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>DragPanelExtender控件的使用</title>
<style type="text/css">
.dragMe
{
width:100%;
height:21px;
background-color:#FFF;
text-align:center;
cursor:move;
font-weight:bold;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div style="height: 300px; width: 250px; float: left; padding: 5px;" >
<asp:Panel
ID="Panel1"
runat="server"
Width="250px"
style="z-index: 20;">
<asp:Panel
ID="Panel2"
runat="server"
Width="250px"
Height="20px"
BorderStyle="Solid"
BorderWidth="2px"
BorderColor="black">
<div class="dragMe">拖动</div>
</asp:Panel>
<asp:Panel
ID="Panel8"
runat="server"
Width="250px"
Height="250px"
BackColor="#0B3D73"
ForeColor="whitesmoke"
BorderWidth="2px"
BorderColor="black"
BorderStyle="Solid" >
<div>
AAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAA。
</div>
</asp:Panel>
</asp:Panel>
</div>
<cc1:DragPanelExtender
ID="DragPanelExtender1"
runat="server"
TargetControlID="Panel1"
DragHandleID="Panel2" />
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0008：
DropShadowExtender控件的使用：阴影效果的实现
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>DropShadowExtender控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:Panel ID="Panel1" Width="200px" Height="150px" BackColor="blue" runat="server"></asp:Panel>
<cc1:DropShadowExtender
ID="DropShadowExtender1"
runat="server"
TargetControlID="Panel1"
Width="5"
Rounded="true"
Radius="6"
Opacity=".75"
TrackPosition="true" />
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0009：
FilteredTextBoxExtender控件的使用：只能输入某些符号的文本框，此例子只能输入数字和+-.
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>FilteredTextBoxExtender控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:TextBox ID="TextBox1" runat="server" />
<cc1:FilteredTextBoxExtender
ID="FilteredTextBoxExtender1"
runat="server"
TargetControlID="TextBox1"
FilterType="Custom,Numbers"
ValidChars="+-." />
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0010：
HoverMenuExtender控件的使用：自动弹出的信息提示框
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>HoverMenuExtender控件的使用</title>
<style type="text/css">
.popupMenu
{
position:absolute;
visibility:hidden;
background-color:#F5F7F8;
opacity:.9;
filter: alpha(opacity=90);
}
.popupHover
{
background-repeat:repeat-x;
background-position:left top;
background-color:#F5F7F8;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:Button ID="Button1" runat="server" Text="Button" />
<cc1:HoverMenuExtender
ID="hme1"
runat="Server"
TargetControlID="Button1"
PopupControlID="PopupMenu"
HoverCssClass="popupHover"
PopupPosition="Right" />
<asp:Panel ID="PopupMenu" runat="server" CssClass="popupMenu" Width="80">
<div style="border:1px outset white; width:100px; height:25px">
这是一个按钮
</div>
</asp:Panel>
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0011：
ModalPopupExtender控件的使用：模式对话框，确定按钮只能执行客户端脚本，当然，可以从客户端调用服务
器方法。
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>ModalPopupExtender控件的使用</title>
<style type="text/css">
.modalPopup
{
background-color:#ffffdd;
border-width:3px;
border-style:solid;
border-color:Gray;
padding:3px;
width:250px;
}
.modalBackground
{
background-color:Gray;
filter:alpha(opacity=70);
opacity:0.7;
}
</style>
<script type="text/javascript">
function OnOk()
{
alert("执行了");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:LinkButton ID="LinkButton1" runat="server" Text="打开模式对话框" />
<asp:Panel ID="Panel1" runat="server" Style="display: none" CssClass="modalPopup">
<asp:Panel ID="Panel3" runat="server" Style="cursor: move;background-color:#DDDDDD;border:solid 1px Gray;color:Black">
<div>
<p>确认执行操作么？</p>
</div>
</asp:Panel>
<div>
<p style="text-align: center;">
<asp:Button ID="OkButton" runat="server" Text="确认"/>
<asp:Button ID="CancelButton" runat="server" Text="取消" />
</p>
</div>
</asp:Panel>
<cc1:ModalPopupExtender
ID="ModalPopupExtender"
runat="server"
TargetControlID="LinkButton1"
PopupControlID="Panel1"
BackgroundCssClass="modalBackground"
OkControlID="OkButton"
OnOkScript="OnOk()"
CancelControlID="CancelButton"
DropShadow="true"
PopupDragHandleControlID="Panel3" />
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0012：
MutuallyExclusiveCheckboxExtender控件的使用：只能选一组中其中一个Checkbox
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>MutuallyExclusiveCheckboxExtender控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:Checkbox runat="server" id="Checkbox1" Text="男" />
<asp:Checkbox runat="server" id="Checkbox2" Text="女" />
<cc1:MutuallyExclusiveCheckboxExtender
ID="MutuallyExclusiveCheckboxExtender1"
runat="server"
TargetControlID="Checkbox1"
Key="SexCheckBox" />
<cc1:MutuallyExclusiveCheckboxExtender
ID="MutuallyExclusiveCheckboxExtender2"
runat="server"
TargetControlID="Checkbox2"
Key="SexCheckBox" />
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0013：
PopupControlExtender控件的使用：弹出窗口控件，这里实现的是日期选择
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>PopupControlExtender控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:TextBox ID="TextBox1" runat="server" AutoCompleteType="office"></asp:TextBox>
<asp:Panel ID="Panel1" runat="server" Height="50px" Width="125px">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<center>
<asp:Calendar ID="Calendar1" runat="server" BackColor="#FFFFCC" BorderColor="#FFCC66"
BorderWidth="1px" DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="8pt"
ForeColor="#663399" Height="200px" ShowGridLines="True" Width="220px" OnSelectionChanged="Calendar1_SelectionChanged">
<SelectedDayStyle BackColor="#CCCCFF" Font-Bold="True" />
<TodayDayStyle BackColor="#FFCC66" ForeColor="White" />
<SelectorStyle BackColor="#FFCC66" />
<OtherMonthDayStyle ForeColor="#CC9966" />
<NextPrevStyle Font-Size="9pt" ForeColor="#FFFFCC" />
<DayHeaderStyle BackColor="#FFCC66" Font-Bold="True" Height="1px" />
<TitleStyle BackColor="#990000" Font-Bold="True" Font-Size="9pt" ForeColor="#FFFFCC" />
</asp:Calendar>
</center>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<cc1:PopupControlExtender
ID="PopupControlExtender1"
runat="server"
TargetControlID="TextBox1"
PopupControlID="Panel1"
Position="Bottom">
</cc1:PopupControlExtender>
</form>
</body>
</html>
CS部分：
protected void Calendar1_SelectionChanged(object sender, EventArgs e)
{
this.PopupControlExtender1.Commit(this.Calendar1.SelectedDate.ToShortDateString());
}
----------------------------------------------------------------------------------------------------
0014：
RoundedCornersExtender控件的使用：控件的圆角效果
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>RoundedCornersExtender控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:Panel ID="Panel1" Width="150px" Height="100px" BackColor="gray" runat="server"></asp:Panel>
<cc1:RoundedCornersExtender
ID="RoundedCornersExtender1"
runat="server"
TargetControlID="Panel1"
Radius="6"
Corners="All">
</cc1:RoundedCornersExtender>
</form>
</body>
</html>
----------------------------------------------------------------------------------------------------
0015：
SlideShowExtender控件的使用：自动播放图片控件
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>SlideShowExtender控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div style="text-align:center">
<asp:Image ID="Image1" runat="server"
Height="300"
Style="border: 1px solid black;width:auto"
ImageUrl="~/images/AJAX.gif"
AlternateText="Blue Hills image" />
<asp:Label runat="Server" ID="imageLabel1"/><br /><br />
<asp:Button runat="Server" ID="prevButton" Text="Prev" Font-Size="Larger" />
<asp:Button runat="Server" ID="playButton" Text="Play" Font-Size="Larger" />
<asp:Button runat="Server" ID="nextButton" Text="Next" Font-Size="Larger" />
<cc1:SlideShowExtender ID="slideshowextend1" runat="server"
TargetControlID="Image1"
SlideShowServicePath="GetData.asmx"
SlideShowServiceMethod="GetSlides"
AutoPlay="true"
ImageDescriptionLabelID="imageLabel1"
NextButtonID="nextButton"
PlayButtonText="Play"
StopButtonText="Stop"
PreviousButtonID="prevButton"
PlayButtonID="playButton"
Loop="true" />
</div>
</form>
</body>
</html>
Web服务部分：GetData.asmx
[System.Web.Script.Services.ScriptService()]
public class GetData : System.Web.Services.WebService
{
[WebMethod]
public AjaxControlToolkit.Slide[] GetSlides()
{
return new AjaxControlToolkit.Slide[]
{
new AjaxControlToolkit.Slide("images/Blue hills.jpg", "Blue Hills", "Go Blue"),
new AjaxControlToolkit.Slide("images/Sunset.jpg", "Sunset", "Setting sun"),
new AjaxControlToolkit.Slide("images/Winter.jpg", "Winter", "Wintery..."),
new AjaxControlToolkit.Slide("images/Water lilies.jpg", "Water lillies", "Lillies in the water"),
new AjaxControlToolkit.Slide("images/VerticalPicture.jpg", "Sedona", "Portrait style picture")
};
}
}
----------------------------------------------------------------------------------------------------
0016：
TabContainer控件的使用：
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>TabContainer控件的使用</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<cc1:TabContainer runat="server" ID="Tabs" Height="150px">
<cc1:TabPanel runat="Server" ID="Panel1" HeaderText="第一部分">
<ContentTemplate>
<div style="width:100%; height:100%; background-color:rgb(70%,80%,90%)">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="按钮1" OnClick="Button1_Click"/>
</div>
</ContentTemplate>
</cc1:TabPanel>
<cc1:TabPanel runat="Server" ID="TabPanel1" HeaderText="第二部分">
<ContentTemplate>
<div style="width:100%; height:100%; background-color:rgb(90%,80%,70%)">
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:Button ID="Button2" runat="server" Text="按钮2" OnClick="Button2_Click"/>
</div>
</ContentTemplate>
</cc1:TabPanel>
</cc1:TabContainer>
</form>
</body>
</html>
CS部分：
protected void Button1_Click(object sender, EventArgs e)
{
this.TextBox1.Text = DateTime.Now.ToLongTimeString();
}
protected void Button2_Click(object sender, EventArgs e)
{
this.TextBox2.Text = this.TextBox1.Text;
}
----------------------------------------------------------------------------------------------------
0017：
TextBoxWatermarkExtender控件的使用：水印效果，可以用来实现提示输入信息的说明
<html xmlns="
http://www.w3.org/1999/xhtml
" >
<head runat="server">
<title>TextBoxWatermarkExtender控件的使用</title>
<style type="text/css">
.unwatermarked
{
height:18px;
width:148px;
font-weight:bold;
}
.watermarked
{
height:20px;
width:150px;
padding:2px 0 0 2px;
border:1px solid #BEBEBE;
background-color:#F0F8FF;
color:gray;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:TextBox ID="TextBox1" CssClass="unwatermarked" Width="150" runat="server" />
<cc1:TextBoxWatermarkExtender
ID="TextBoxWatermarkExtender1"
runat="server"
TargetControlID="TextBox1"
WatermarkText="输入姓名"
WatermarkCssClass="watermarked" />
</form>
</body>
</html>
Atlas控件使用说明