Отображение календаря на форме с использованием Datepicker

@Goret · Регистрация: 25.02.2016

Студворк — интернет-сервис помощи студентам

Доброго времени суток. Есть форма, на которой при загрузке отображается два текстовых поля DateOfArrival и DateOfLeave. Кликая по ним отображается календарь, где можно установить дату.
Проблема в том, что нужно при загрузке формы, в этих текстовых полях стояло по умолчанию сегодняшняя дата и плюс один день соответственно.
Не знаю как задать текущую дату полю DateOfArrival при загрузке формы.

C#
1
2
3
4
5
6
7
8
9
10
11
[Required(ErrorMessage = "Установите дату")]
        [DataType(DataType.Date)]
        [DisplayFormat(DataFormatString = "{0:dd'.'MM'.'yyyy}", ApplyFormatInEditMode = true)]
        [Display(Name = "Дата заезда")]
        public DateTime DateOfArrival { get; set; }
 
        [Required(ErrorMessage = "Установите дату")]
        [DataType(DataType.Date)]
        [DisplayFormat(DataFormatString = "{0:dd'.'MM'.'yyyy}", ApplyFormatInEditMode = true)]
        [Display(Name = "Дата выезда")]
        public DateTime DateOfLeave { get; set; }

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div class="editor-label">
                    @Html.LabelFor(model => model.DateOfArrival)
                </div>
                <div class="editor-field">
                    @Html.EditorFor(model => model.DateOfArrival)
                    @Html.ValidationMessageFor(model => model.DateOfArrival)
                </div>
 
                <div class="editor-label">
                    @Html.LabelFor(model => model.DateOfLeave)
                </div>
                <div class="editor-field">
                    @Html.EditorFor(model => model.DateOfLeave)
                    @Html.ValidationMessageFor(model => model.DateOfLeave)
                </div>

@SPNick · 11.09.2018, 10:44

Goret, примерно так

C#
1
2
3
4
5
6
7
8
9
10
public ActionResult Index()
{
    var model = new MyClass()
    {
        DateOfArrival = DateTime.Now.Date,
        DateOfLeave = DateTime.Now.Date.AddDays(1)
    };
 
    return View(model);
}

@Goret · 11.09.2018, 11:15 **[ТС]**

SPNick, воспользовался вашим примером, только разместил его методе Post предыдущей страницы. Получился такой варинт

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
[HttpPost]
        public ActionResult FirstPage(HotelLoading hotel)
        {
            if (ModelState.IsValid) { 
            hotel.DateOfArrival = DateTime.Now.Date;
            hotel.DateOfArrival = DateTime.Now.Date.AddDays(1);
 
        
            return RedirectToAction("FirstPageOsn");
            }
 
            return View(hotel);
        }

Но при загрузке страницы все равно даты по умолчанию не стоят

@SPNick · 11.09.2018, 11:30

Goret, POST\GET не использовал никогда, поэтому точно не скажу. Но м.б. это нужно в GET? Т.е. дефолтные даты нужны в момент загрузки страницы, а не в момент отправки данных формы на сервер. В POST должны улетать даты, которые выбрал пользователь на странице. Чисто догадка.

Ааа, въехал.
Т.е. если на предыдущей странице все поля заполнены как нужно - перенаправляешь на действие "FirstPageOsn", где и есть эти поля с датами.
Тогда перенаправлять нужно так

C#
1
return RedirectToAction("ActionName", modelObject);

@Goret · 11.09.2018, 11:40 **[ТС]**

SPNick, В метод Get поместил, но так же не отображает дат. Точнее он их задает , но странице в браузере не отображает

@SPNick · 11.09.2018, 11:50

Goret,я бы прописал даты прямо внутри действия FirstPageOsn, как-то это правильнее имхо.

Затрудняюсь еще что-то подсказать.. у меня все календари через модуль bootstrap-datetimepicker создаются - таких проблем не было никогда

Добавлено через 3 минуты
и еще момент

Сообщение от Goret

@Html.EditorFor

лучше заменить на @Html.TextBoxFor

С EditorFor возникают всякие непонятки периодически, лучше отказаться от их использования.

@Goret · 15.09.2018, 23:07 **[ТС]**

SPNick, знаете начальную дату установить по умолчанию получилось с @Html.TextBoxFor, но при клике по нему календарь не вылазит, как было с @Html.EditorFor

@Goret · 16.09.2018, 17:08 **[ТС]**

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

Здесь начальная дата устанавливается, но нету выпадающего календара

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
        <link rel="stylesheet" href="/resources/demos/style.css">
        <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
        <script>
  $( function() {
    $( "#datepicker" ).datepicker();
  });
  if ($("#dateField").val() != '') {
      var arrDate = $('#dateField').val().split(" ");
      $('#dateField').val(arrDate[0]);
  }
        </script>
 
 
@Html.TextBoxFor(m => m.DateOfArrival, "{0:d MMM yyyy}", new { @class = "form-control", @id = "dateField" })

Второй вариант

HTML5
1
2
@Html.EditorFor(model => model.DateOfArrival,
                new { htmlAttributes = new { @class = "form-control", @id = "StartDate" } })

C#
1
2
3
4
5
6
7
8
public ActionResult FirstPageOsn()
        {
return View(new HotelLoading
            {
                DateOfArrival = DateTime.Now,
                DateOfLeave = DateTime.Now.Date.AddDays(1)
            });
        }

@SPNick · 18.09.2018, 10:40

Сообщение от Goret

но при клике по нему календарь не вылазит

Посмотрите в developer tools браузера что происходит (F12), проверьте совпадение id полей в представлении и js. Чудес не бывает, проблема должна отображаться где-то

Новые блоги и статьи Все статьи Все блоги /
PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .	Ломающие изменения в C#.NStar Alpha Etyuhibosecyu 20.11.2025 Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .	Мысли в слух kumehtar 18.11.2025 Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .	Создание Single Page Application на фреймах krapotkin 16.11.2025 Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .

@Goret 1 / 1 / 2 Регистрация: 25.02.2016 Сообщений: 141
	11.09.2018, 11:40 [ТС]
	SPNick, В метод Get поместил, но так же не отображает дат. Точнее он их задает , но странице в браузере не отображает 0

@Goret 1 / 1 / 2 Регистрация: 25.02.2016 Сообщений: 141
	15.09.2018, 23:07 [ТС]
	SPNick, знаете начальную дату установить по умолчанию получилось с @Html.TextBoxFor, но при клике по нему календарь не вылазит, как было с @Html.EditorFor 0