Ajax Calender Extender Control
Ajax Calender Extender Control: Its a Light weight
control and works fine!
For that you have to drag Ajax's ToolkitScriptManager and required a TextBox and Ajax's CalendarExtender
Below is the css for CalendarExtender,and the Textbox where we need to control CalendarExtender
<style type="text/css">
.cal_Theme1 .ajax__calendar_container {
background-color: #e2e2e2;
border:solid 1px #cccccc;
}
.cal_Theme1 .ajax__calendar_header {
background-color: #ffffff;
margin-bottom: 4px;
}
.cal_Theme1 .ajax__calendar_title,
.cal_Theme1 .ajax__calendar_next,
.cal_Theme1 .ajax__calendar_prev {
color: #004080;
padding-top: 3px;
}
.cal_Theme1 .ajax__calendar_body {
background-color: #e9e9e9;
border: solid 1px #cccccc;
}
.cal_Theme1 .ajax__calendar_dayname {
text-align:center;
font-weight:bold;
margin-bottom: 4px;
margin-top: 2px;
}
.cal_Theme1 .ajax__calendar_day {
text-align:center;
}
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_day,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_month,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_year,
.cal_Theme1 .ajax__calendar_active {
color: #004080;
font-weight: bold;
background-color: #ffffff;
}
.cal_Theme1 .ajax__calendar_today {
font-weight:bold;
}
.cal_Theme1 .ajax__calendar_other,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_today,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_title {
color: #bbbbbb;
}
</style>
<br />
<asp:TextBox ID="TextBoxDate" runat="server" ></asp:TextBox>
<asp:CalendarExtender
CssClass="cal_Theme1"
ID="CalendarExtender1"
runat="server"
PopupButtonID="Image1"
PopupPosition="Right"
TargetControlID="TextBoxDate">
</asp:CalendarExtender>
You may also like
Best css style for autocomplete.
Autocomplete Extender Control.
Ajax Progress Bar.
No comments:
Post a Comment