private void RegisterCustomScripts(RangeDateTimePicker datePickerObject) { // Get client IDs string rangeCalendarClientId = rangeCalendar.ClientID; string textBoxClientId = datePickerObject.DateTimeTextBox.ClientID; string altTextBoxClientId = datePickerObject.AlternateDateTimeTextBox.ClientID; string dateFromClientId = dateFrom.ClientID; string dateToClientId = dateTo.ClientID; string calendarImgClientId = datePickerObject.CalendarImageClientID; // Button OK btnOK.OnClientClick = String.Format(@"$cmsj('#{0}').val ($cmsj('#{1}').cmsdatepicker ('getFormattedDate')); $cmsj('#{2}').val ($cmsj('#{3}').cmsdatepicker ('getFormattedDate')); $cmsj('#{4}').hide(); {5}", textBoxClientId, dateFromClientId, altTextBoxClientId, dateToClientId, rangeCalendarClientId, !datePickerObject.PostbackOnOK ? "return false;" : ""); if (datePickerObject.DisplayNAButton) { btnNA.OnClientClick = String.Format("$cmsj('#{0}').hide(); $cmsj('#{1}').val(''); $cmsj('#{2}').val(''); return false;", rangeCalendarClientId, textBoxClientId, altTextBoxClientId); btnNA.Visible = true; } // Icon string clickScript = String.Format(@"if( $cmsj('#{0}').is(':hidden')) {{ $cmsj('#{1}').cmsdatepicker('setDate',$cmsj('#{3}').val()); $cmsj('#{2}').cmsdatepicker('setDate',$cmsj('#{4}').val()); var offset = localizeRangeCalendar($cmsj('#{0}'),$cmsj('#{3}'),{5},true); $cmsj('#{0}').css({{left:offset.left+'px',top:offset.top+'px'}});$cmsj('#{0}').show();}} return false;", rangeCalendarClientId, dateFromClientId, dateToClientId, textBoxClientId, altTextBoxClientId, CultureHelper.IsUICultureRTL().ToString().ToLowerCSafe()); datePickerObject.DateTimeTextBox.Attributes["OnClick"] = clickScript; datePickerObject.AlternateDateTimeTextBox.Attributes["OnClick"] = clickScript; // Add image on click String script = String.Format("$cmsj(\"#{0}\").click(function() {{ {1} }});", calendarImgClientId, clickScript); ScriptHelper.RegisterStartupScript(this, typeof(string), ClientID + "CalendarImageInitScript", ScriptHelper.GetScript(script)); // Script for hiding calendar when clicked somewhere else ltlScript.Text = ScriptHelper.GetScript(String.Format(@"$cmsj(document).mousedown(function(event) {{ var target = $cmsj(event.target); if ((target.closest('#{0}').length == 0) && (target.parents('#{0}').length == 0) && (target.closest('#{1}').length == 0) && (target.closest('#{2}').length == 0) && (target.closest('#{3}').length == 0)) $cmsj('#{0}').hide(); }});", rangeCalendarClientId, calendarImgClientId, textBoxClientId, altTextBoxClientId)); }
protected override void OnPreRender(EventArgs e) { base.OnPreRender(e); RangeDateTimePicker datePickerObject = PickerControl as RangeDateTimePicker; if ((datePickerObject == null) || !Visible) { return; } // Register default scripts RegisterDefaultScripts(datePickerObject); // Register initial range picker scripts RegisterPickerInitScripts(datePickerObject); // Register custom scripts for control components RegisterCustomScripts(datePickerObject); }
private void RegisterPickerInitScripts(RangeDateTimePicker datePickerObject) { // Init picker settings var settings = new HashSet<string>(); settings.Add(String.Format("showTimePanel:{0}", (datePickerObject.EditTime && !datePickerObject.DisableDaySelect && !datePickerObject.DisableMonthSelect).ToString().ToLowerCSafe())); settings.Add(String.Format("stepMonths:{0}", datePickerObject.DisableMonthSelect ? 12 : 1)); settings.Add(String.Format("disableDaySelect:{0}", datePickerObject.DisableDaySelect.ToString().ToLowerCSafe())); settings.Add(String.Format("disableMonthSelect:{0}", datePickerObject.DisableMonthSelect.ToString().ToLowerCSafe())); settings.Add(String.Format("changeMonth:{0}", (!datePickerObject.DisableMonthSelect).ToString().ToLowerCSafe())); settings.Add("showButtonPanel:false"); // Get all parameters for picker initialization string pickerParams = GetScriptParameters(datePickerObject, settings); // Init both calendars string calendarInit = String.Format(@"$cmsj(function() {{$cmsj('#{0}').cmsdatepicker({{ {1},defaultTimeValue:{2} }}); $cmsj('#{3}').cmsdatepicker({{ {1},defaultTimeValue:{4} }})}});", dateFrom.ClientID, pickerParams, (datePickerObject.UseDynamicDefaultTime ? 1 : 0), dateTo.ClientID, (datePickerObject.UseDynamicDefaultTime ? 2 : 0)); ScriptHelper.RegisterClientScriptBlock(Page, GetType(), ClientID + "_RegisterDatePickerFunction", ScriptHelper.GetScript(calendarInit)); }
private void RegisterPickerInitScripts(RangeDateTimePicker datePickerObject) { // Init picker settings var settings = new HashSet <string>(); settings.Add(String.Format("showTimePanel:{0}", (datePickerObject.EditTime && !datePickerObject.DisableDaySelect && !datePickerObject.DisableMonthSelect).ToString().ToLowerCSafe())); settings.Add(String.Format("stepMonths:{0}", datePickerObject.DisableMonthSelect ? 12 : 1)); settings.Add(String.Format("disableDaySelect:{0}", datePickerObject.DisableDaySelect.ToString().ToLowerCSafe())); settings.Add(String.Format("disableMonthSelect:{0}", datePickerObject.DisableMonthSelect.ToString().ToLowerCSafe())); settings.Add(String.Format("changeMonth:{0}", (!datePickerObject.DisableMonthSelect).ToString().ToLowerCSafe())); settings.Add("showButtonPanel:false"); // Get all parameters for picker initialization string pickerParams = GetScriptParameters(datePickerObject, settings); // Init both calendars string calendarInit = String.Format(@"$cmsj(function() {{$cmsj('#{0}').cmsdatepicker({{ {1},defaultTimeValue:{2} }}); $cmsj('#{3}').cmsdatepicker({{ {1},defaultTimeValue:{4} }})}});", dateFrom.ClientID, pickerParams, (datePickerObject.UseDynamicDefaultTime ? 1 : 0), dateTo.ClientID, (datePickerObject.UseDynamicDefaultTime ? 2 : 0)); ScriptHelper.RegisterClientScriptBlock(Page, GetType(), ClientID + "_RegisterDatePickerFunction", ScriptHelper.GetScript(calendarInit)); }
/// <summary> /// Load resources for calendar control. /// </summary> /// <param name="datePickerObject">Calendar control with settings</param> private void LoadResources(RangeDateTimePicker datePickerObject) { if (Directory.Exists(Server.MapPath(datePickerObject.CustomCalendarSupportFolder))) { // Register JS files string[] files = Directory.GetFiles(Server.MapPath(datePickerObject.CustomCalendarSupportFolder), "*.js"); string path = Server.MapPath("~/"); foreach (string file in files) { string relative = "~/" + file.Substring(path.Length).Replace(@"\", "/");; ScriptHelper.RegisterScriptFile(Page, relative); } // Register CSS files files = Directory.GetFiles(Server.MapPath(datePickerObject.CustomCalendarSupportFolder), "*.css"); foreach (string file in files) { string relative = "~/" + file.Substring(path.Length).Replace(@"\", "/");; CSSHelper.RegisterCSSLink(Page, relative); } } }
/// <summary> /// Load resources for calendar control. /// </summary> /// <param name="datePickerObject">Calendar control with settings</param> private void LoadResources(RangeDateTimePicker datePickerObject) { if (Directory.Exists(Server.MapPath(datePickerObject.CustomCalendarSupportFolder))) { // Register JS files string[] files = Directory.GetFiles(Server.MapPath(datePickerObject.CustomCalendarSupportFolder), "*.js"); string path = Server.MapPath("~/"); foreach (string file in files) { string relative = "~/" + file.Substring(path.Length).Replace(@"\", "/"); ; ScriptHelper.RegisterScriptFile(Page, relative); } // Register CSS files files = Directory.GetFiles(Server.MapPath(datePickerObject.CustomCalendarSupportFolder), "*.css"); foreach (string file in files) { string relative = "~/" + file.Substring(path.Length).Replace(@"\", "/"); ; CSSHelper.RegisterCSSLink(Page, relative); } } }
protected void Page_Load(object sender, EventArgs e) { RangeDateTimePicker datePickerObject = PickerControl as RangeDateTimePicker; if (datePickerObject == null) { return; } // Default settings int numberOfRows = 6; // Buttons NotAvaible,Done,Now bool showActionPanel = false; // Hides if date is selected bool hideOnDateSelection = false; // Display seconds bool displaySeconds = true; // Add icon - triggers datepicker show string shownOn = "button"; // If true display time bool displayTime = datePickerObject.EditTime && !datePickerObject.DisableDaySelect && !datePickerObject.DisableMonthSelect; string minDate = String.Empty; string maxDate = String.Empty; if (datePickerObject.UseCalendarLimit) { if (datePickerObject.MinDate != DateTimeHelper.ZERO_TIME) { minDate = "minDate: " + (datePickerObject.MinDate.Date - DateTime.Now.Date).Days.ToString() + ","; } if (datePickerObject.MaxDate != DateTimeHelper.ZERO_TIME) { maxDate = "maxDate: " + (datePickerObject.MaxDate.Date - DateTime.Now.Date).Days.ToString() + ","; } } LoadResources(datePickerObject); int stepMonth = datePickerObject.DisableMonthSelect ? 12 : 1; CultureInfo culture = new CultureInfo(datePickerObject.CultureCode, true); DateTimeFormatInfo info = culture.DateTimeFormat; // Register default css a js files ScriptHelper.RegisterJQuery(Page); ScriptHelper.RegisterScriptFile(Page, "JQuery/jquery-ui-datetimepicker.js"); ScriptHelper.RegisterScriptFile(Page, "Controls/modalCalendar.js"); CSSHelper.RegisterCSSLink(Page, "~/CMSAdminControls/ModalCalendar/Themes/Calendar_core.css"); string datePattern = info.ShortDatePattern.Replace("yyyy", "yy").Replace("'", ""); if (displayTime) { datePattern += " " + (displaySeconds ? info.LongTimePattern : info.ShortTimePattern); } bool use24HourMode = !datePattern.Contains("tt"); // Generate 'now' string with full year string format = info.ShortDatePattern; if (Regex.Matches(format, "y").Count == 2) { format = format.Replace("yy", "yyyy"); } string now = CMSContext.DateTimeConvert(DateTime.Now, datePickerObject.TimeZone, datePickerObject.CustomTimeZone).ToString(format, culture); // Localized settings string localize = String.Format("monthNames:{0},monthNamesShort:{1},dayNames:{2},dayNamesMin:{3},firstDay:{4},", ArrayToString(info.MonthNames), ArrayToString(info.AbbreviatedMonthNames), ArrayToString(info.DayNames), ArrayToString(info.ShortestDayNames), ConvertFirstDayToNumber(info.FirstDayOfWeek)); localize += String.Format("AMDesignator:'{0}',PMDesignator:'{1}',closeText:'{2}',isRTL:{3},prevText:'{4}',nextText:'{5}',defaultDate:'{6}'", info.AMDesignator.Replace("'", "\\'"), info.PMDesignator.Replace("'", "\\'"), ResHelper.GetString("general.ok").Replace("'", "\\'"), culture.TextInfo.IsRightToLeft.ToString().ToLowerCSafe(), ResHelper.GetString("calendar.previous").Replace("'", "\\'"), ResHelper.GetString("calendar.next").Replace("'", "\\'"), now); // Classic settings String initParameters = String.Format("numberOfRows:{0},showTimePanel:{1},use24HourMode:{2},showButtonPanel:{3},hideOnDateSelection:{4},displaySeconds:{5},", numberOfRows, displayTime.ToString().ToLowerCSafe(), use24HourMode.ToString().ToLowerCSafe(), showActionPanel.ToString().ToLowerCSafe(), hideOnDateSelection.ToString().ToLowerCSafe(), displaySeconds.ToString().ToLowerCSafe()); initParameters += String.Format("IconID:'{0}',showOn:'{1}',dateFormat:'{2}',disableDaySelect:{3},disableMonthSelect:{4},stepMonths:{5},changeMonth:{6},timeZoneOffset:{7},selectOtherMonths:true,showOtherMonths:true,changeYear:true", datePickerObject.CalendarImageClientID, shownOn, datePattern, datePickerObject.DisableDaySelect.ToString().ToLowerCSafe(), datePickerObject.DisableMonthSelect.ToString().ToLowerCSafe(), stepMonth, (!datePickerObject.DisableMonthSelect).ToString().ToLowerCSafe(), datePickerObject.TimeZoneOffset); // Init first calendar string calendarInit = "$j(function() {$j('#" + dateFrom.ClientID + "').cmsdatepicker({" + minDate + maxDate + localize + "," + initParameters + ",defaultTimeValue:" + (datePickerObject.UseDynamicDefaultTime ? 1 : 0) + "});"; // Init second calendar calendarInit += "$j('#" + dateTo.ClientID + "').cmsdatepicker({" + minDate + maxDate + localize + "," + initParameters + ",defaultTimeValue:" + (datePickerObject.UseDynamicDefaultTime ? 2 : 0) + "})});"; ScriptHelper.RegisterClientScriptBlock(Page, GetType(), ClientID + "_RegisterDatePickerFunction", ScriptHelper.GetScript(calendarInit)); // Button OK btnOK.OnClientClick = "$j('#" + datePickerObject.DateTimeTextBox.ClientID + "').val ($j('#" + dateFrom.ClientID + "').cmsdatepicker ('getFormattedDate'));"; btnOK.OnClientClick += "$j('#" + datePickerObject.AlternateDateTimeTextBox.ClientID + "').val ($j('#" + dateTo.ClientID + "').cmsdatepicker ('getFormattedDate'));"; btnOK.OnClientClick += "$j('#" + rangeCalendar.ClientID + "').hide();"; if (datePickerObject.DisplayNAButton) { btnNA.OnClientClick = "$j('#" + rangeCalendar.ClientID + "').hide(); $j('#" + datePickerObject.DateTimeTextBox.ClientID + "').val('');$j('#" + datePickerObject.AlternateDateTimeTextBox.ClientID + "').val('');return false;"; btnNA.Visible = true; } if (!datePickerObject.PostbackOnOK) { btnOK.OnClientClick += "return false;"; } // Icon string clickScript = " if( $j('#" + rangeCalendar.ClientID + @"').is(':hidden')) { $j('#" + dateFrom.ClientID + "').cmsdatepicker('setDate',$j('#" + datePickerObject.DateTimeTextBox.ClientID + @"').val()); $j('#" + dateTo.ClientID + "').cmsdatepicker('setDate',$j('#" + datePickerObject.AlternateDateTimeTextBox.ClientID + @"').val()); var offset = localizeRangeCalendar($j('#" + rangeCalendar.ClientID + "'),$j('#" + datePickerObject.DateTimeTextBox.ClientID + "')," + CultureHelper.IsUICultureRTL().ToString().ToLowerCSafe() + ",true);" + "$j('#" + rangeCalendar.ClientID + "').css({left:offset.left+'px',top:offset.top+'px'});$j('#" + rangeCalendar.ClientID + "').show();}return false;"; // Add image on click String script = "$j(\"#" + datePickerObject.CalendarImageClientID + "\").click(function() {" + clickScript + "});"; ScriptHelper.RegisterStartupScript(this, typeof(string), ClientID + "CalendarImageInitScript", ScriptHelper.GetScript(script)); datePickerObject.DateTimeTextBox.Attributes["OnClick"] = clickScript; datePickerObject.AlternateDateTimeTextBox.Attributes["OnClick"] = clickScript; // Script for hiding calendar when clicked somewhere else ltlScript.Text = ScriptHelper.GetScript(@"$j(document).mousedown(function(event) { var target = $j(event.target); if ((target.closest('#" + rangeCalendar.ClientID + "').length == 0) && (target.parents('#" + rangeCalendar.ClientID + @"').length == 0) && (target.closest('#" + datePickerObject.CalendarImageClientID + "').length == 0) && (target.closest('#" + datePickerObject.DateTimeTextBox.ClientID + @"').length == 0) && (target.closest('#" + datePickerObject.AlternateDateTimeTextBox.ClientID + @"').length == 0)) $j('#" + rangeCalendar.ClientID + @"').hide(); });"); }