How to set the location of CalendarExtender by the Mouse when clicking the page

最新推荐文章于 2024-07-25 09:24:40 发布

aifengyi6776

最新推荐文章于 2024-07-25 09:24:40 发布

阅读量55

点赞数

文章标签： xhtml javascript ViewUI

原文链接：http://www.cnblogs.com/Zhi-QiangNi/archive/2009/01/27/1381062.html

版权

Preface

Everytime we want to display the CalendarExtender at the client side, we need to use this code:

Code
$find(“the calendar’s behaviorid”).show();

Text

How can we change the location of the Calendar as we wish?

Here is the solution:

Code
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="TestCalendarPosition.aspx.vb"
    Inherits="SoluTest_CalendarUserControl.TestCalendarPosition" %>

<%@ 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>

    <script type="text/javascript">

        //To handle the mouse up event
        function onMouseUp() {
            $find("cal").hide();
            $find("cal").show();
        }

        //We need to change the position after the Calendar is shown.
        //To handle the client shown event
        function calendarShown() {
            //If set a breakpoint here,you may notice that the style of the Calendar popup div would like this:
            //    "LEFT: 10px; VISIBILITY: visible; POSITION: absolute; TOP: 38px"
            //The current postion is the Target TextBox's position. Now, let's specify it.
            $get("cal_popupDiv").style.top = event.offsetY;
            $get("cal_popupDiv").style.left = event.offsetX;
        }

    </script>

</head>
<body>
    <form id="form1" runat="server" onmouseup="onMouseUp()" style="background-color: #FFFF99;
    width: 1000px; height: 1000px;">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <cc1:CalendarExtender ID="TextBox1_CalendarExtender" runat="server" BehaviorID="cal"
            Enabled="True" TargetControlID="TextBox1" OnClientShown="calendarShown">
        </cc1:CalendarExtender>
    </div>
    </form>
</body>
</html>

Comment

The cal_popupDiv document is the popup div of Calendar "cal", it can also be find by using

Code
$find("cal")._popupDiv

Code
$find("cal")._popupBehavior._element

We need to check if it is null before using it.

Note

Note that I set the Calendar’s popup position as the Mouse’s offset position and it can only be used in IE, you can change it as your wish.

The related thread url:http://forums.asp.net/t/1373908.aspx

转载于:https://www.cnblogs.com/Zhi-QiangNi/archive/2009/01/27/1381062.html

aifengyi6776

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
How to set the location of CalendarExtender by the Mouse when clicking the page

PrefaceEverytime we want to display the CalendarExtender at the client side, we need to use this code:Code$find(“thecalendar’sbehaviorid”).show();TextHow can we change the location...
复制链接

扫一扫