How to Set up Datetimepicker of ASP.NET AJAX Using Csharp

How to Put up DateTimePicker Using C#

Home > How to > Calendar DateTimePicker

This page is arranged to display all the related sample C# codes for setting and customizing DateTimePicker properties of Kettic Web Calendar UI for ASP.NET AJAX.

C# Sample Codes to Set DatePopupButton

DatePopupButton is the first button in the datetimepicker (ASP.NET sample image for calendar datetimepicker) and by clicking this control we are capable of setting following properties: Visible, ImageUrl, Border, ToolTip, BackColor, etc.


PerDateTimePicker1.DatePopupButton.BorderColor = System.Drawing.Color.Red;
PerDateTimePicker1.DatePopupButton.BorderWidth = 3;
PerDateTimePicker1.DatePopupButton.Visible = true;

C# Sample Codes to Set TimePopupButton

The second button is TimePopupButton, with the support of which we are able to set properties, like Visible, ImageUrl, Border, ToolTip, BackColor and others.


PerDateTimePicker1.TimePopupButton.BorderColor = System.Drawing.Color.YellowGreen;
PerDateTimePicker1.TimePopupButton.BorderWidth = 3;
PerDateTimePicker1.TimePopupButton.Visible = true;

C# Sample Codes to Set Datetimepicker properties


PerDateTimePicker1.Visible = true;
PerDateTimePicker1.MinDate = new DateTime(2000, 1, 1);
PerDateTimePicker1.MaxDate = new DateTime(3000, 1, 1);
PerDateTimePicker1.PopupDirection = DatePickerPopupDirection.BottomRight;
PerDateTimePicker1.ShowAnimation.Duration = 500;
PerDateTimePicker1.ShowAnimation.Type = CalendarAnimationType.Slide;

Datetimepicker properties can be specific in three controls:

MaxDate/ MinDate: the maximum and minimum data number that can be set with the support of asp.net calendar Datetimepicker.
Culture: if we apply and change this property, the text of web calendar datatimepicker will be change in the same time.
PopupDirection: we can freely move datetimepicker to these four directions: TopLeft , TopRight , BottomLeft and BottomRight with the support of this property.

C# Sample Codes to Set TimeView


PerDateTimePicker1.TimeView.TimeFormat = "HH:mm";
PerDateTimePicker1.TimeView.Columns = 4;
PerDateTimePicker1.TimeView.RenderDirection = RepeatDirection.Vertical;

Above sample C# codes are respectively for setting and adjusting these for properties of TimeView: TimeFormat, StartTime/EndTime, Interval, Columns, and RenderDirection. And we also give their brief introductions.

TimeFormat: use this property to set the format of time of time viewer.
StartTime/EndTime: use StartTime and EndTime properties to change the range of times displayed.
Interval: the interval between adjacent times in the time view. For instance, if we set the starttime as 9 am, the endtime as 10 am, and the interval as 15 minutes, then the time will be displayed like 9:00, 9:15, 9:30, 9:45, and 10:00. The valid values are between StartTime and EndTime.
Columns: use this attribute to set and change the number of columns. If we set the column as 3, then there will be 3 sets of time in each raw.
RenderDirection: use to set and adjust arrangement of time in viewer: vertical or horizontal.

C# Sample Codes to Set DateInput

Property collection of DateInput component:

DateFormat: is used to set the format of input time.
DisplayDateFormat: is used to display the time format.
Apprearance: property for setting and defining the appearance of dateinput, which consists of backcolor, textcolor, Border and others.


PerDateTimePicker1.DateInput.DateFormat = "d";
PerDateTimePicker1.DateInput.DisplayDateFormat = "d";
PerDateTimePicker1.DateInput.BackColor = System.Drawing.Color.DarkOrange;
PerDateTimePicker1.DateInput.Font.Bold = true;

ASP.NET AJAX UI Controls

ASP.NET AJAX Chart UI Control ASP.NET AJAX Grid UI Control ASP.NET AJAX Barcode UI Control ASP.NET AJAX Button UI Control

ASP.NET AJAX Calendar UI Control

Overview Getting Started

Calendar element

Title Navigation Controls Column and Row Headers

Pickers

TimePicker DatePicker DateTimePicker MonthYearPicker Using shared Calendar/TimeView Formatting Values

Templates

Calendar Day Templates Calendar Header and Footer Temlates

Features

Customizing the Day Matrix Multi-View Mode Managing Dates Date Selection

Client Prpgramming

Calendar Event

Server Programming