I have a simple objective. I can simulate the problem by creating a clean project.
The problem is that I cant set the asp.net calendarExtender display date (when opened) correctly when setting the date on the text box dynamically.
Here is a code:
HTML:
<asp:Button
ID="Button1"
runat="server"
Text="2013"
OnClientClick="SetDate(0);return false;" />
<asp:Button
ID="Button2"
runat="server"
Text="2015"
OnClientClick="SetDate(1);return false;" />
<br />
<asp:TextBox
runat="server"
ID="tbDate"></asp:TextBox>
<asp:CalendarExtender
ID="clDate"
runat="server"
Enabled="True"
BehaviorID="calendarExtender"
TargetControlID="tbDate">
</asp:CalendarExtender>
JavaScript:
var Data = (function () {
var _items = [{ ID: 1, Date: "19/12/2013" },
{ ID: 2, Date: "19/12/2015" }];
function _GetAll() {
return _items;
}
function _GetByID(itemID) {
var o = $.grep(_items, function (el, i) {
return el.ID === itemID;
});
return o[0];
}
return {
GetByID: _GetByID,
GetAll: _GetAll
}
})();
function SetDate(itemID) {
var item = Data.GetByID(itemID);
var stringDate = item.Date;
var objectDate = Date.parseLocale(item.Date, "dd/MM/yyyy");
$("#tbDate").val(stringDate);
$find("calendarExtender").set_selectedDate(objectDate);
}
This should be as simple as it gets, but the control seams to have its own behavior. From what I conclude, the display date (when opened) it always assumes the last chosen date. No matter what you do.
Some scenarious:
SCENARIO 1
1-load page
2-click on the textbox, opening the calendar extender.
3-calendar extender assumes current date.
4-click on 2013 button, textbox is updated to 2013 date.
5-cick on the textbox, opening the calendar extender.....still has 2014(current date)
SCENARIO 2
1-load page 2-click on 2013 button, textbox is updated to 2013 date.
3-click on the textbox, opening the calendar extender.
4-calendar extender assumes 2013 (correct date).
5-click on 2015 button, textbox is updated to 2015 date.
3-click on the textbox, opening the calendar extender.....still has 2013(first date)
SCENARIO 3
(same as 2 but starting with button 2015 click)
SCENARIO 4
1-load page
2-click on 2013 button, textbox is updated to 2013 date (DO NOT CLICK ON TEXT BOX).
3-click on 2015 button, textbox is updated to 2015 date.
4-click on the textbox, opening the calendar extender.....assumes 2015(last date)
NOTE: if I display the current set date dynamically with
alert($find("calendarExtender").get_selectedDate());
, its correct. But the display simply wont refresh.
Is this the correct behavior? Am I missing something?
How can I make it assume the correct date?
Ok, I did a little more testing and found that the visualization only gets updated when a post back occurs.
Since I was trying to avoid post backs.....ill just go for the jquery datepicker.