I have the same request , i have added couple of lines of code after going through CalenderBehaviour.js as below , it has functionality clear for use once you done below 10 changes the clear functionality works fine , awesome :)
1) Find this._today = null; in the js and add the below code
//ravishanker maduri added for clear
this._clear = null
2) Add the below code before the function "get_visibleDate: function () {"
set_clearDate: function (value) {/////ravishanker maduri added for clear
if (value && (String.isInstanceOfType(value)) && (value.length != 0)) {
value = new Date(value);
}
if (value) value = value.getDateOnly();
if (this._selectedDate != value) {
this._selectedDate = value;
this._selectedDateChanging = true;
var text = "";
if (value) {
text = '';
}
if (text != this._textbox.get_Value()) {
this._textbox.set_Value(text);
this._fireChanged();
}
this._selectedDateChanging = false;
this.invalidate();
this.raisePropertyChanged("ClearDate");
}
},
3) Add the below function after get_todayButton: function () {
get_clearButton: function () {////ravishanker maduri added for clear
/// <value type="Sys.UI.DomElement">
/// The button used to select todays date
/// </value>
return '';
},
4)add the below code after the code this.set_selectedDate(value);}
var value = this.get_ClearDate();
if (value) {
this.set_clearDate(value); ////ravishanker maduri added for clear
}
5) Add the below code after the if loop if (this._today) {
if (this._clear) {////ravishanker maduri added for clear
$common.removeHandlers(this._clear, this._cell$delegates);
this._clear = null;
}
6) Add the below code after "var todayWrapper = $common.createElementFromTemplate({ nodeName: "div" }, this._popupDiv);"
////ravishanker maduri added for clear
var clearWrapper = $common.createElementFromTemplate({ nodeName: "div" }, this._popupDiv);
7) add the below code after block this._today = $common.createElementFromTemplate({
8)Add the below code after the "this._today.appendChild(document.createTextNode(String.format(AjaxControlToolkit.Resources.Calendar_Today, todaysDate.localeFormat("MMMM d, yyyy"))));
this._today.date = todaysDate;"
////ravishanker maduri added for clear for clearing the existing or already added clear
if (this._clear.firstChild) {
this._clear.removeChild(this._clear.firstChild);
}
this._clear.appendChild(document.createTextNode('Clear'));
this._clear.value = 'Clear';
//End of Clear
9) Add the below new case after "case "today":"
/////ravishanker maduri added for clear
case "clear":
this.set_selectedDate(target.date);
this._switchMonth(target.date);
this._blur.post(true);
this.raiseDateSelectionChanged();
break;
Once you done above 9 changes add the below line for the style css file calender.css
Ravishankar
Member
13 Points
17 Posts
Adding clear functionality for CalenderExtender Control in ajax tool kit
Sep 03, 2012 03:31 PM|LINK
Hi Friends ,
I have the same request , i have added couple of lines of code after going through CalenderBehaviour.js as below , it has functionality clear for use once you done below 10 changes the clear functionality works fine , awesome :)
1) Find this._today = null; in the js and add the below code
//ravishanker maduri added for clear
this._clear = null
2) Add the below code before the function "get_visibleDate: function () {"
set_clearDate: function (value) {/////ravishanker maduri added for clear
if (value && (String.isInstanceOfType(value)) && (value.length != 0)) {
value = new Date(value);
}
if (value) value = value.getDateOnly();
if (this._selectedDate != value) {
this._selectedDate = value;
this._selectedDateChanging = true;
var text = "";
if (value) {
text = '';
}
if (text != this._textbox.get_Value()) {
this._textbox.set_Value(text);
this._fireChanged();
}
this._selectedDateChanging = false;
this.invalidate();
this.raisePropertyChanged("ClearDate");
}
},
3) Add the below function after get_todayButton: function () {
get_clearButton: function () {////ravishanker maduri added for clear
/// <value type="Sys.UI.DomElement">
/// The button used to select todays date
/// </value>
return '';
},
4)add the below code after the code this.set_selectedDate(value);}
var value = this.get_ClearDate();
if (value) {
this.set_clearDate(value); ////ravishanker maduri added for clear
}
5) Add the below code after the if loop if (this._today) {
if (this._clear) {////ravishanker maduri added for clear
$common.removeHandlers(this._clear, this._cell$delegates);
this._clear = null;
}
6) Add the below code after "var todayWrapper = $common.createElementFromTemplate({ nodeName: "div" }, this._popupDiv);"
////ravishanker maduri added for clear
var clearWrapper = $common.createElementFromTemplate({ nodeName: "div" }, this._popupDiv);
7) add the below code after block this._today = $common.createElementFromTemplate({
////ravishanker maduri added for clear
this._clear = $common.createElementFromTemplate({
nodeName: "div",
properties: {
id: this.get_id() + "_clear",
mode: "clear"
},
events: this._cell$delegates,
cssClasses: ["ajax__calendar_footer", "ajax__calendar_clear"]
}, clearWrapper);
//end of ravi added clear
8)Add the below code after the "this._today.appendChild(document.createTextNode(String.format(AjaxControlToolkit.Resources.Calendar_Today, todaysDate.localeFormat("MMMM d, yyyy"))));
this._today.date = todaysDate;"
////ravishanker maduri added for clear for clearing the existing or already added clear
if (this._clear.firstChild) {
this._clear.removeChild(this._clear.firstChild);
}
this._clear.appendChild(document.createTextNode('Clear'));
this._clear.value = 'Clear';
//End of Clear
9) Add the below new case after "case "today":"
/////ravishanker maduri added for clear
case "clear":
this.set_selectedDate(target.date);
this._switchMonth(target.date);
this._blur.post(true);
this.raiseDateSelectionChanged();
break;
Once you done above 9 changes add the below line for the style css file calender.css
10) .ajax__calendar .ajax__calendar_hover .ajax__calendar_clear {}
11) add below code to CalenderExtenderControl.cs file
[DefaultValue(null)]
[ExtenderControlProperty]
[ClientPropertyName("clearDate")]
public DateTime? clearDate
{
get { return GetPropertyValue<DateTime?>("clearDate", null); }
set { SetPropertyValue<DateTime?>("clearDate", value); }
}
please remember to click answer .
Regards
Ravishanker Maduri