ASP.NET DateTime Picker

Ответ 1

JQuery имеет лучший datepicker IMHO. Хотя он не специфичен для .Net, все еще отлично работает.

HTML:

<input type="text" value="9/23/2009" style="width: 100px;" readonly="readonly" name="Date" id="Date" class="hasDatepicker"/>

В элементе head:

<script src="../../Scripts/jquery-1.3.2.min.js" language="javascript" type="text/javascript"/>
<script src="../../Scripts/jquery-ui-1.7.1.custom.min.js" type="text/javascript"/>

Просто как это!

Ответ 2

Ответ на ваш вопрос: Да, есть хороший бесплатный элемент управления выбором времени/с открытым исходным кодом, который хорошо сочетается с управлением календаря ASP.NET.

Управление календаря ASP.NET просто пишет таблицу html.

Если вы используете HTML5 и DOT.NET Framework 4.5, вместо этого вы можете использовать элемент управления TextBox ASP.NET и установить для свойства TextMode значение "Дата" или "Месяц" или "Неделя" или "Время" или "DateTimeLocal", или если вы не, используя Chrome или Firefox или Internet Explorer, вы также можете установить это свойство в "DateTime".

Затем прочитайте свойство Text, чтобы получить дату, время или месяц или неделю в виде строки из TextBox.

Если вы используете DOT.NET Framework 4.0 или более раннюю версию, вы можете использовать либо тип ввода html5 = "дата" , либо тип ввода = "месяц" или тип ввода = "неделя" или тип ввода = "время" или input type = "datetime-local", или если вы не, используя Chrome или Firefox или Internet Explorer, тогда вы также можете использовать тип ввода = "datetime".

Если вам нужен код на стороне сервера (написанный на С# или Visual Basic) информацией, введенной пользователем в поле даты, тогда вы можете попробовать запустить этот элемент на сервере, записав внутри тега ввода runat="server"

Также дайте этому элементу идентификатор, поэтому вы можете получить к нему доступ на стороне сервера. Прочтите свойство Value, чтобы ввести дату ввода, время, месяц или неделю в виде строки. Если вы не можете запустить этот элемент на сервере, вам потребуется скрытое поле в дополнение к типу ввода = "дата" или "время" или "месяц" или "неделя" . В функции отправки (написанной в javascript) установите значение скрытого поля в значение типа ввода = "дата" или "время" , или "месяц" , или "неделя" , а затем код на стороне сервера, прочитайте свойство Value этого скрытого поля как строку.

Уверен, что элемент скрытого поля html может работать на сервере.

Надеюсь, что это поможет.

Ответ 3

В текстовое поле добавьте это:

textmode="Date"

Это дает вам красивый вид Datepicker, как это:

Другие варианты этого:

textmode="DateTime"

Это дает вам этот вид:

textmode="DateTimeLocal"

Ответ 4

Поскольку это единственный, который я использовал, я бы предложил CalendarExtender из http://www.ajaxcontroltoolkit.com/

Ответ 5

Это решение без jquery.

Добавить Календарь и TextBox в WebForm → Источник WebForm имеет следующее:

<asp:Calendar ID="Calendar1" runat="server" OnSelectionChanged="DateChange">
</asp:Calendar>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

Создание методов в файле cs WebForm:

protected void Page_Load(object sender, EventArgs e)
    {
        TextBox1.Text = DateTime.Today.ToShortDateString()+'.';
    }

    protected void DateChange(object sender, EventArgs e)
    {
        TextBox1.Text = Calendar1.SelectedDate.ToShortDateString() + '.';
    }

Метод DateChange связан с событием CalendarChanged. Это выглядит так: Изображение DatePicker

Ответ 6

Basic Date Picker Lite

Это бесплатная версия своего флагманского продукта, но в нем есть сборщик данных и времени, основанный на asp.net.

Ответ 7

Попробуйте bootstrap-datepicker, если вы используете загрузку.

Ответ 8

Существует простая, из коробки реализация: HTML 5 input type="date" и другие типы ввода, связанные с датой.

Хорошо, вы не можете много стилизовать элементы управления, а не работает в каждом браузере, но все же это может быть очень хороший вариант в долгосрочной перспективе, если все современные браузеры поддерживают его и не хотят включать тяжелые библиотеки, которые не всегда хорошо работают на мобильных устройствах.

Ответ 9

Если вы хотите работать с текстовым полем, имейте в виду, что установка для свойства TextMode значения "Дата" не будет работать в Internet Explorer 11, поскольку в настоящее время он не поддерживает значения "Дата", "Дата и время" и "Время".

Этот пример иллюстрирует, как реализовать это с помощью текстового поля, включая проверку дат (поскольку пользователь может вводить только цифры). Он будет работать как в Internet Explorer 11, так и в других веб-браузерах.

<asp:Content ID="Content"
         ContentPlaceHolderID="MainContent"
         runat="server">

<link rel="stylesheet"
    href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
   <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
   <script>
   $(function () {
   $("#
   <%= txtBoxDate.ClientID %>").datepicker();
   });
 </script>
 <asp:TextBox ID="txtBoxDate"
           runat="server"
           Width="135px"
           AutoPostBack="False"
           TabIndex="1"
           placeholder="mm/dd/yyyy"
           autocomplete="off"
           MaxLength="10"></asp:TextBox>
 <asp:CompareValidator ID="CompareValidator1"
                    runat="server"
                    ControlToValidate="txtBoxDate"
                    Operator="DataTypeCheck"
                    Type="Date">Date invalid, please check format. 
 </asp:CompareValidator>
 </asp:Content>

Ответ 10

@Html.EditorFor(model => model.Date, new { htmlAttributes = new { @class = "form-control", @type = "date" } })

это хорошо работает