Awesome ASP.net Web-Forms Controls

Simple DatePicker

Date:
DatePickerDemo.aspx
<% Date.DatePicker().Value(new DateTime(2017, 11, 1)); %>
<awe:Ocon runat="server" ID="Date" />

Inline Calendar

Date inline:
DatePickerDemo.aspx
<% DateInline.DatePicker().InlineCalendar(true, true); %>
<awe:Ocon runat="server" ID="DateInline" />

With ChangeMonth and ChangeYear

Date:
DatePickerDemo.aspx
<% Date2.DatePicker()
.ChangeMonth()
.ChangeYear(); %>
<awe:Ocon runat="server" ID="Date2" />

Min, max, default date, clear button

Date:
DatePickerDemo.aspx
<% Date3.DatePicker().NumberOfMonths(3)
.MinDate(DateTime.Now.AddDays(1))
.MaxDate(DateTime.Now.AddMonths(7))
.DefaultDate(DateTime.Now.AddDays(4))
.ClearButton(); %>
<awe:Ocon runat="server" ID="Date3" />

Date range

From:
To:
DatePickerDemo.aspx
<div class="elabel">
From:
</div>
<div class="einput">
<% DateFrom.DatePicker().NumberOfMonths(2).ChangeMonth().ChangeYear(); %>
<awe:Ocon runat="server" ID="DateFrom" />
</div>
<div class="elabel">
To:
</div>
<div class="einput">
<% DateTo.DatePicker().NumberOfMonths(2); %>
<awe:Ocon runat="server" ID="DateTo" />
</div>
<script>
$(function () {
var from = $('#<%=DateFrom.ClientID %>');
var to = $('#<%=DateTo.ClientID %>');

from.change(function () {
to.data('o').p.min = from.val();
});

to.change(function () {
from.data('o').p.max = to.val();
});
});
</script>

Right to left

DatePickerDemo.aspx
<div class="einput" style="direction: rtl;">
<% Date4.DatePicker().ChangeMonth().ChangeYear(); %>
<awe:Ocon runat="server" ID="Date4" />
</div>

TimePicker

DatePickerDemo.aspx
<% Tmp1.TimePicker(); %>
<awe:Ocon runat="server" ID="Tmp1" />



Comments

We use cookies to improve your online experience. By accessing this site, you agree to the use of cookies and other technologies to process your personal data (e.g. IP address) to enhance and personalise your experience across our websites. Additionally, third-party companies, may store cookies on your device and use similar technologies to collect and use certain information. For more information, refer to our privacy policy and cookie policy.