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
Or
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
浙公网安备 33010602011771号