您的位置：首页 > 运维架构

Ajax之PopupControl应用--帮助用户输入的面板

2010-01-09 20:47 441 查看

PopupControl扩展器控件可以附加到任何控件之上，当用户点击该控件时，将弹出一个预先指定好的、显示附加信息或用来帮助用户执行某些设定的Panel。当该控件失去输入焦点之后，Panel将自动消失，且用户在其中进行的配置将被设定到扩展器的目标控件之上。

实例图片(暂时不会插入图片)：

AjaxTestPopupControl.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AjaxTestPopupControl.aspx.cs"
Inherits="WebDemo.Ajax.AjaxTestPopupControl" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!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>
<mce:style type="text/css"><!--
/*Popup Control*/
.popupControl
{
background-color:White;
position:absolute;
visibility:hidden;
}

--></mce:style>
</head>
<body>
<!--
TargetControlID：该扩展器目标控件的ID，即用户鼠标点击之后显示弹出面板的控件的ID
PpoupControlID：作为弹出面板的Panel的ID
Position：弹出面板与目标控件位置的相对关系，可选Bottom(底部)、Center(中心)、Left(左边)、Right(右边)或Top(顶部)
OffsetX：基于Position设定，弹出面板与目标控件在X方向的额外偏移量，单位为像素(px)
OffsetY：基于Position设定，弹出面板与目标控件在Y方向的额外偏移量，单位为像素(px)
CommitProperty：目标控件的一个HTML属性，例如TextBox的value、Label的innerHTML等。用户在弹出面板内作出的选择值
将通过该扩展器控件的Commit()方法设定到目标控件的该属性上。该属性的默认值会自动选择目标控件的
默认属性
CommitScript：在设置万CommitProperty属性之后，附加执行的一段JavaScript脚本，可用来对刚刚的设定值进行修饰等操作
-->
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:Panel ID="testPanel" CssClass="popupControl" runat="server">
<div style="border: 1px outset white; width: 100px">
<asp:UpdatePanel ID="testUpdatePanel" runat="server">
<ContentTemplate>
<asp:RadioButtonList ID="testList" runat="server"
onselectedindexchanged="testList_SelectedIndexChanged" AutoPostBack=true>
<asp:ListItem Text="admin1" Value="admin1"></asp:ListItem>
<asp:ListItem Text="admin2" Value="admin2"></asp:ListItem>
<asp:ListItem Text="admin3" Value="admin3"></asp:ListItem>
<asp:ListItem Text="admin4" Value="admin4"></asp:ListItem>
</asp:RadioButtonList>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</asp:Panel>
<div>
<asp:TextBox ID="tabTest" runat="server"></asp:TextBox>
<cc1:PopupControlExtender ID="tabTest_PopupControlExtender" runat="server" DynamicServicePath=""
Enabled="True" ExtenderControlID="" TargetControlID="tabTest" PopupControlID="testPanel"
Position="Bottom" CommitProperty="value" CommitScript="e.value;">
</cc1:PopupControlExtender>
</div>
</form>

</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航