I had a problem in SelectionChanging event. Once I select a date on calendar the event triggered fine. But when I click the same day on second time, the event won’t work. Pl helps me to solve this.
Hi Hasithi,
That is correct if day already selected, then on mouse click for same day no selection is changed and therefore no-selection-change will be raised. Otherwise it would be a bug. If you need to check if selected date was clicked, then I can suggest you to process mouse event, check which day was clicked and check if that day was already selected. Below is example:
<script type="text/javascript">function calendarMouseDown(cal, args){ var id = cal.idFromMouse(args.get_browserEvent()); if(id < 0 || id > 41) return; var day = cal.get_days()[id]; if(day.isSelected()) alert('day is already selected:' + day.get_year() + '/' + day.get_month() + '/' + day.get_day());}function calendarSel(cal, args){}</script><ig:WebMonthCalendar ID="WebMonthCalendar1" runat="server"> <ClientEvents MouseDown="calendarMouseDown" SelectionChanging="calendarSel" /></ig:WebMonthCalendar>
Thanks for the reply. But what I wants to do is change the selected day in my SelectionChanging event. Because once SelectionChanging occur, I’m adding a custom day with a style. In the second selection I will be able to add another custom day with different style to the same day. Therefore I need to change the selected day in my SelectionChanging event. I tried, but not succeeded. Below is my code.
<script type="text/javascript">
function ChangeSelection(sender, args) {
if (document.getElementById("txtHiddenHolidayType").value != null) {
var Date = sender.get_selectedRange();
if (Date != null) {
var selectedType = document.getElementById("txtHiddenHolidayType").value;
var style = GetSelectedStyle(selectedType);
document.getElementById("txtHiddenSelectedDate").value = document.getElementById("txtHiddenSelectedDate").value + Date;
var arr = new Array();
var arr2 = new Array();
arr = document.getElementById("txtHiddenSelectedDate").value.split(",");
for (var i = 0; i < arr.length; i++) {
arr2 = arr[i].split(" ");
var selectedDayName = arr2[0];
var selectedMonthName = arr2[1];
var selectedMonth = FindMonth(selectedMonthName);
var selectedDay = arr2[2];
var selectedYear = arr2[5];
var strDate_Style = selectedDayName + " " + selectedMonthName + " " + selectedDay + " " + "xx" + " " + "xxx" + " " + selectedYear + "#" + selectedType + "%";
document.getElementById("txtHiddenDateCollection").value = document.getElementById("txtHiddenDateCollection").value + strDate_Style;
$find(sender._id).addCustomDay(selectedYear, selectedMonth, selectedDay, "", "", "", style);
}
</script>
<ig:WebMonthCalendar ID="WebMonthCalendar2" runat="server" DayNameFormat="FirstLetter"
EnableWeekNumbers="True" FirstDayOfWeek="Monday" Height="150px" HideOtherMonthDays="True"
SelectionType="Multi" ShowNextPrevMonth="False" Width="200px" FooterContent=""
TitleFormat="Month" ShowFooter="False" StyleSetPath="../ig_calendar2.css" CellSpacing="1"
EnableMonthDropDown="False" EnableYearDropDown="False">
<ClientEvents SelectionChanging="GetSelectedDate" SelectionChanged="ChangeSelection" />
</ig:WebMonthCalendar>