Hi,
Harry US11:i want to know whether this calender extender takes the date of client side or server side??
I assume that you would like to know how to get the selected date of the CalendarExtender.
At the client side, we can find the selected date by using this code: $find("the Extender’s ID or BehaviorID”).get_selectedDate().
At the server side, the code is this: TextBox1_CalendarExtender.SelectedDate
Harry US11: is there any alternative that i can choose alone the month and year selected from the textbox.text????
I have built a test application to achieve your goal about modify the Month separately, please refer to the code:
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="TestOnlyChangeMonth.aspx.vb"
Inherits="SoluTest_CalendarUserControl.TestOnlyChangeMonth" %>
<%@ 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">
var cal;
function pageLoad() {
cal = $find("calendar1");
//we need to modify the original delegate of the month cell.
cal._cell$delegates = {
mouseover: Function.createDelegate(cal, cal._cell_onmouseover),
mouseout: Function.createDelegate(cal, cal._cell_onmouseout),
click: Function.createDelegate(cal, function(e) {
/// <summary>
/// Handles the click event of a cell
/// </summary>
/// <param name="e" type="Sys.UI.DomEvent">The arguments for the event</param>
e.stopPropagation();
e.preventDefault();
if (!cal._enabled) return;
var target = e.target;
var visibleDate = cal._getEffectiveVisibleDate();
Sys.UI.DomElement.removeCssClass(target.parentNode, "ajax__calendar_hover");
switch (target.mode) {
case "prev":
case "next":
cal._switchMonth(target.date);
break;
case "title":
switch (cal._mode) {
case "days": cal._switchMode("months"); break;
case "months": cal._switchMode("years"); break;
}
break;
case "month":
//if the mode is month, then stop switching to day mode.
if (target.month == visibleDate.getMonth()) {
//this._switchMode("days");
} else {
cal._visibleDate = target.date;
//this._switchMode("days");
}
cal.set_selectedDate(target.date);
cal._switchMonth(target.date);
cal._blur.post(true);
cal.raiseDateSelectionChanged();
break;
case "year":
if (target.date.getFullYear() == visibleDate.getFullYear()) {
cal._switchMode("months");
} else {
cal._visibleDate = target.date;
cal._switchMode("months");
}
break;
// case "day":
// this.set_selectedDate(target.date);
// this._switchMonth(target.date);
// this._blur.post(true);
// this.raiseDateSelectionChanged();
// break;
case "today":
cal.set_selectedDate(target.date);
cal._switchMonth(target.date);
cal._blur.post(true);
cal.raiseDateSelectionChanged();
break;
}
})
}
}
function onCalendar1Shown(sender, args) {
//set the default mode to month
sender._switchMode("months", true);
if (cal._monthsBody) {
//remove the old handler of each month body.
for (var i = 0; i < cal._monthsBody.rows.length; i++) {
var row = cal._monthsBody.rows[i];
for (var j = 0; j < row.cells.length; j++) {
$common.removeHandlers(row.cells[j].firstChild, cal._cell$delegates);
}
}
//add the new handler of each month body.
for (var i = 0; i < cal._monthsBody.rows.length; i++) {
var row = cal._monthsBody.rows[i];
for (var j = 0; j < row.cells.length; j++) {
$addHandlers(row.cells[j].firstChild, cal._cell$delegates);
}
}
}
}
function onCalendar2Change(sender, args) {
if (!sender.get_selectedDate()) {
var finalDate = new Date();
} else {
var finalDate = new Date(sender.get_selectedDate());
}
if ($get("TextBox1").value != "") {
finalDate.setMonth(parseFloat($get("TextBox1").value) - 1);
}
sender.set_selectedDate(finalDate);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" />
The Month:<asp:TextBox ID="TextBox1" runat="server" AutoCompleteType="Disabled"></asp:TextBox>
<cc1:CalendarExtender ID="CalendarExtender1" BehaviorID="calendar1" runat="server"
Enabled="True" Format="MM" TargetControlID="TextBox1" OnClientShown="onCalendar1Shown">
</cc1:CalendarExtender>
The Day/The Year:
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<cc1:CalendarExtender ID="CalendarExtender2" BehaviorID="calendar2" runat="server"
Enabled="True" Format="dd/yyyy" TargetControlID="TextBox2" OnClientHidden="onCalendar2Change"
OnClientShown="onCalendar2Change">
</cc1:CalendarExtender>
</div>
</form>
</body>
</html>
Have my code helped?
You can also refer to this thread:http://forums.asp.net/t/1342779.aspx
Best regards,
Zhi-Qiang Ni