AJAXControlToolKit控件入门实例之PopupControl

原创 2007年10月11日 16:08:00

选认识一下它的基本属性:

<ajaxToolkit:PopupControlExtender ID="PopEx" runat="server"
    TargetControlID="DateTextBox"
    PopupControlID="Panel1"
    Position="Bottom" />
  • TargetControlID - The ID of the control to attach to
  • PopupControlID - The ID of the control to display
  • Position - Optional setting specifying where the popup should be positioned relative to the target control. (Left, Right, Top, Bottom, Center) 

前台代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="PopupControl.aspx.cs" Inherits="PopupControl" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

<!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>
    <style type="text/css">
    /*Popup Control*/
.popupControl{
 background-color:White;
 position:absolute;
 visibility:hidden;
}
   
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
     <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" />
    <div class="demoarea">
        <div class="demoheading">PopupControl Demonstration</div>
   
        Enter date for new reminder:
        <asp:TextBox ID="DateTextBox" runat="server" Width="80" autocomplete="off" /><br /><br />
        <asp:Panel ID="Panel1" runat="server" CssClass="popupControl">
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                   <center>
                        <asp:Calendar ID="Calendar1" runat="server" Width="179px" DayNameFormat="Shortest"
                            BackColor="White" BorderColor="#999999" CellPadding="1" Font-Names="Verdana"
                            Font-Size="8pt" ForeColor="Black" OnSelectionChanged="Calendar1_SelectionChanged" Height="172px">
                                <SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />
                                <TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />
                                <SelectorStyle BackColor="#CCCCCC" />
                                <WeekendDayStyle BackColor="#FFFFCC" />
                                <OtherMonthDayStyle ForeColor="Gray" />
                                <NextPrevStyle VerticalAlign="Bottom" />
                                <DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />
                                <TitleStyle BackColor="#999999" Font-Size="7pt" BorderColor="Black" Font-Bold="True" />
                        </asp:Calendar>
                    </center>
                </ContentTemplate>
            </asp:UpdatePanel>
        </asp:Panel>
        <ajaxToolkit:PopupControlExtender ID="PopupControlExtender1" runat="server"
            TargetControlID="DateTextBox"
            PopupControlID="Panel1"
            Position="Bottom" />
       
        Reminder message:
        <asp:TextBox ID="MessageTextBox" runat="server" Width="200" autocomplete="off" /><br /><br />
        <asp:Panel ID="Panel2" runat="server" CssClass="popupControl">
            <div style="border: 1px outset white; width: 100px">
                <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                    <ContentTemplate>
                        <asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="true"
                            OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged">
                                <asp:ListItem Text="Walk dog" />
                                <asp:ListItem Text="Feed dog" />
                                <asp:ListItem Text="Feed cat" />
                                <asp:ListItem Text="Feed fish" />
                                <asp:ListItem Text="Cancel" Value="" />
                        </asp:RadioButtonList>
                    </ContentTemplate>
                </asp:UpdatePanel>
            </div>
        </asp:Panel>
        <ajaxToolkit:PopupControlExtender ID="PopupControlExtender2" runat="server"
            TargetControlID="MessageTextBox"
            PopupControlID="Panel2"
            CommitProperty="value"
            Position="Bottom"
            CommitScript="e.value += ' - do not forget!';" />

        <asp:UpdatePanel ID="UpdatePanel3" runat="server">
            <ContentTemplate>
                <asp:Button ID="ReminderButton" runat="server" Text="Add reminder" OnClick="ReminderButton_Click" />
                <br /><br />
                <asp:Label ID="Label1" runat="server" Text="[No response provided yet]" />
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
    <div class="demobottom"></div>
    </div>
    </form>
</body>
</html>

后台代码:

using System;
using System.Data;
using System.Configuration;
using System.Collections;
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;

public partial class PopupControl : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    /// <summary>
    /// Handler for the "add reminder" button
    /// </summary>
    /// <param name="sender">source</param>
    /// <param name="e">arguments</param>
    protected void ReminderButton_Click(object sender, EventArgs e)
    {
        string text;
        try
        {
            text = string.Format("A reminder would have been created for {0} with the message /"{1}/"",
                DateTime.Parse(DateTextBox.Text).ToLongDateString(), MessageTextBox.Text);
        }
        catch (FormatException ex)
        {
            text = string.Format("[Unable to parse /"{0}/": {1}]", DateTextBox.Text, ex.Message);
        }
        Label1.Text = HttpUtility.HtmlEncode(text);
    }

    /// <summary>
    /// Handler for calendar changes
    /// </summary>
    /// <param name="sender">source</param>
    /// <param name="e">arguments</param>
    protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
        // Popup result is the selected date
        PopupControlExtender1.Commit(Calendar1.SelectedDate.ToShortDateString());
    }

    /// <summary>
    /// Handler for radio button changes
    /// </summary>
    /// <param name="sender">source</param>
    /// <param name="e">arguments</param>
    protected void RadioButtonList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        if (!string.IsNullOrEmpty(RadioButtonList1.SelectedValue))
        {
            // Popup result is the selected task
            PopupControlExtender2.Commit(RadioButtonList1.SelectedValue);
        }
        else
        {
            // Cancel the popup
            PopupControlExtender2.Cancel();
        }
        // Reset the selected item
        RadioButtonList1.ClearSelection();


    }
}

 

VS2010/MFC编程入门之二十三(常用控件:按钮控件的编程实例)

上一节VS2010/MFC编程入门教程中鸡啄米讲了按钮控件Button、Radio Button和Check Box的基本用法,本节就继续讲按钮控件的内容,通过一个实例让大家更清楚按钮控件在实际的...
  • my_lord_
  • my_lord_
  • 2016年08月24日 21:02
  • 1774

VS2013/MFC编程入门之三十(常用控件:树形控件Tree Control 下)

前面一节讲了树形控件Tree Control的简介、通知消息以及相关数据结构,本节继续讲下半部分,包括树形控件的创建、CTreeCtrl类的主要成员函数和应用实例。        树形控件的创建 ...
  • zhaoyinhui0802
  • zhaoyinhui0802
  • 2016年12月03日 15:56
  • 1999

VS2013/MFC编程入门之二十八(常用控件:列表视图控件List Control 下)

上一节是关于列表视图控件List Control的上半部分,简单介绍了列表视图控件,其通知消息的处理和有关结构体的定义。本节继续讲解下半部分,包括列表视图控件的创建、CListCtrl类的主要成员函数...
  • zhaoyinhui0802
  • zhaoyinhui0802
  • 2016年12月03日 10:47
  • 2635

Ajax控件、实例(AjaxControlToolKit)

  • 2009年02月09日 11:55
  • 5.37MB
  • 下载

快速浏览AjaxControlToolKit控件(二)

五.DragPanelExtender 主要属性: 1.TargetControlID:被拖动的对象ID 2.DragHandleID:能够执行拖动操作的对象ID 当然DragHandleID...
  • wendy_soft
  • wendy_soft
  • 2014年03月28日 14:07
  • 304

net3.5 和vs2008中Ajax控件的使用--AjaxControlToolkit的安装

net3.5 和vs2008中Ajax控件的使用--AjaxControlToolkit的安装【ASP.NET AJAX】2010-02-02 17:03:42阅读322评论1  字号:大中小 订阅1...
  • Lying_20101021
  • Lying_20101021
  • 2011年02月27日 07:39
  • 836

AjaxControlToolkit控件集详解

1.Accordion 功能:实现了QQ、Msn好友分类的折叠效果,就像包含了多个CollapsiblePanels 细节: (1)不要把Accordion放在Table种同时又把 FadeT...
  • lins1393997412
  • lins1393997412
  • 2012年04月04日 16:04
  • 692

快速浏览AjaxControlToolKit控件(三)

九.ResizableControlExtender 主要属性: 1.TargetControlID:需要自动缩放的元素的ID 2.HandleCssClass:控制自动缩放元素的手柄样式 3...
  • wendy_soft
  • wendy_soft
  • 2014年03月28日 14:07
  • 331

一个很好用的Ajax控件库AjaxControlToolkit

====================================================== 注:本文源代码点此下载 =============================...
  • mmnan
  • mmnan
  • 2012年02月02日 23:41
  • 280

AjaxControlToolkit控件集详解 .

AjaxControlToolkit下载 http://ajax.asp.net/downloads/default.aspx?tabid=47 http://www.codeplex.com/A...
  • hao_guo
  • hao_guo
  • 2012年04月12日 15:54
  • 170
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:AJAXControlToolKit控件入门实例之PopupControl
举报原因:
原因补充:

(最多只允许输入30个字)