ReSQL.ru
     
powered by simpleCommunicator - 2.0.59     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / ASP.NET [игнор отключен] [закрыт для гостей] / bootstrap-datetimepicker как ?
25 сообщений из 30, страница 1 из 2
  1  все
bootstrap-datetimepicker как ?
    #38957183
ProBiotek
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ProBiotek
Участник
Привет.

Я все еще сильно нуб.
Подскажите пожалуйста, как на форме вывести datetime picker и получить из него результат ?

Вот есть такая простенькая форма:
Код: c#
1.
2.
3.
4.
                    <div class="form-group">
                        <label class="col-lg-4 control-label">Дата<br/><span style="color: red; font-size: 12px">@Html.ValidationMessageFor(x => x.Date)</span></label>
                        <div class="col-lg-6">@Html.TextBoxFor(x => x.Date, new {@class = "form-control"})</div>
                    </div>



Подскажите пожалуйста, как вообще переделать ее, чтобы использовался bootstrap-datetimepicker ?
Если в asp.Net MVC я что то уже понимаю. Но вот в JS пока совсем плох. Покажите плиз пример.
...
Рейтинг: 0 / 0
13.05.2015, 11:31
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38957202
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
ну как-то так, если приложение по шаблону в студии создавалось и bootstrap с jquery уже из NuGet-а соответсвенно установленны:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
<link href=@Url.Content("~/Content/datepicker.css") rel="stylesheet" />

<div class="form-group">
    <label class="col-lg-4 control-label">Дата<br/>
    <span style="color: red; font-size: 12px">@Html.ValidationMessageFor(x => x.Date)</span></label>
    <div class="col-lg-6">@Html.TextBoxFor(x => x.Date, new {@class = "form-control"})</div>
</div>

<script src=@Url.Content("~/Scripts/bootstrap-datepicker.js")></script>
<script>
    $('input[name=Date]').datepicker({ viewMode: 'years' });
</script>
...
Рейтинг: 0 / 0
13.05.2015, 11:43
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38957205
ProBiotek
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ProBiotek
Участник
skyANA,

Спасибо большое ! Буду набираться опыта, но пока даже нет понимания особого в js
...
Рейтинг: 0 / 0
13.05.2015, 11:46
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38957210
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
ProBiotekskyANA,

Спасибо большое ! Буду набираться опыта, но пока даже нет понимания особого в jsКнижку купите.
...
Рейтинг: 0 / 0
13.05.2015, 11:49
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38957226
ProBiotek
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ProBiotek
Участник
skyANAProBiotekskyANA,

Спасибо большое ! Буду набираться опыта, но пока даже нет понимания особого в jsКнижку купите.

Какую именно книгу по рекомендуете ?

Фримена по ASp.Net я прочитал - правда какие-то главы пропустил, чтобы побыстрее. В плане asp.Net понимаение есть. Контроллеры там, экшены.
А вот в плане js пока нету.
...
Рейтинг: 0 / 0
13.05.2015, 11:53
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38957303
Monochromatique
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Monochromatique
Участник
Стоит различать

bootstrap datepicker

и

bootstrap date time picker


https://bootstrap-datepicker.readthedocs.org/en/latest/

https://eonasdan.github.io/bootstrap-datetimepicker/
...
Рейтинг: 0 / 0
13.05.2015, 12:28
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38957305
Фотография Алексей К
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Алексей К
Участник
http://javascript.ru/
...
Рейтинг: 0 / 0
13.05.2015, 12:29
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959724
ProBiotek
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ProBiotek
Участник
skyANA,

Что то не получилось. Это мой первый JS код, поэтому возможно я где то очень очень сильно туплю.

Код: c#
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
<div class="form-group">
                       ....
                    </div>



                    <div class="form-group">
                        <label class="col-lg-4 control-label">
                            Дата<br/>
                            <span style="color: red; font-size: 12px">@Html.ValidationMessageFor(x => x.Date)</span>
                        </label>
                        <div class="col-lg-6">@Html.TextBoxFor(x => x.Date, new {@class = "form-control"})</div>
                    </div>

                    <script>
                        $('input[name=Date]').datepicker({ viewMode: 'years' });
                    </script>




                    <div class="form-group">
                        <div class="col-lg-9 col-lg-offset-4">.....
...
Рейтинг: 0 / 0
15.05.2015, 12:43
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959726
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
ProBiotek, нормальный пример сделайте, где видно какие скрипты Вы подключили.
...
Рейтинг: 0 / 0
15.05.2015, 12:45
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959730
ProBiotek
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ProBiotek
Участник
Код: c#
1.
2.
3.
4.
@{
    var controlName = "Workplace";
    <link href=@Url.Content("~/Content/datepicker.css") rel="stylesheet" />
}
...
Рейтинг: 0 / 0
15.05.2015, 12:47
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959735
ProBiotek
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ProBiotek
Участник
skyANAProBiotek, нормальный пример сделайте, где видно какие скрипты Вы подключили.
Что имеется ввиду ?
...
Рейтинг: 0 / 0
15.05.2015, 12:47
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959736
Фотография Алексей К
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Алексей К
Участник
ProBiotekЧто то не получилось.Не указал Name у input.
...
Рейтинг: 0 / 0
15.05.2015, 12:48
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959740
Фотография Алексей К
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Алексей К
Участник
Алексей КProBiotekЧто то не получилось.Не указал Name у input.Хотя нет, указал...
...
Рейтинг: 0 / 0
15.05.2015, 12:51
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959741
ProBiotek
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ProBiotek
Участник
Алексей К,

Вот же оно
...
Рейтинг: 0 / 0
15.05.2015, 12:52
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959752
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
ProBiotekskyANAProBiotek, нормальный пример сделайте, где видно какие скрипты Вы подключили.
Что имеется ввиду ?Какие элементы <script> присутствуют на странице? View Page Source в студию!
...
Рейтинг: 0 / 0
15.05.2015, 13:04
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959759
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
Bootstrap подключён, судя по тому, что стили для class="form-control" сработали :)
...
Рейтинг: 0 / 0
15.05.2015, 13:07
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959770
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
Кстати Monochromatique правильно отметил, что стоит отличать bootstrap-datepicker и bootstrap-datetimepicker.

Как-то так должно работать:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
<link href="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/d004434a5ff76e7b97c8b07c01f34ca69e635d97/build/css/bootstrap-datetimepicker.css" rel="stylesheet">
<script src="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/d004434a5ff76e7b97c8b07c01f34ca69e635d97/src/js/bootstrap-datetimepicker.js"></script>
// ...
<div class="form-group">
    <label class="col-lg-4 control-label">
        Дата<br/>
        <span style="color: red; font-size: 12px">@Html.ValidationMessageFor(x => x.Date)</span>
    </label>
    <div class="col-lg-6">@Html.TextBoxFor(x => x.Date, new {@class = "form-control"})</div>
</div>

<script>
    $('#Date').datetimepicker();
</script>
// ...
...
Рейтинг: 0 / 0
15.05.2015, 13:13
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959776
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
Вернее так:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
<link href="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/d004434a5ff76e7b97c8b07c01f34ca69e635d97/build/css/bootstrap-datetimepicker.css" rel="stylesheet">
<script src="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/d004434a5ff76e7b97c8b07c01f34ca69e635d97/src/js/bootstrap-datetimepicker.js"></script>
// ...
<div class="form-group">
    <label class="col-lg-4 control-label">
        Дата<br/>
        <span style="color: red; font-size: 12px">@Html.ValidationMessageFor(x => x.Date)</span>
    </label>
    <div class="col-lg-6" id="datetimepicker-for-Date">@Html.TextBoxFor(x => x.Date, new {@class = "form-control"})</div>
</div>

<script>
    $('#datetimepicker-for-Date').datetimepicker();
</script>
// ...


Bootstrap 3 Datepicker v4 Docs
...
Рейтинг: 0 / 0
15.05.2015, 13:16
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959781
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
Нет, всё таки этот ( 17644788 ) вариант. Причём обязательно надо загрузить Moment.js: http://jsfiddle.net/6105cfmc/
...
Рейтинг: 0 / 0
15.05.2015, 13:25
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959790
ProBiotek
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ProBiotek
Участник
skyANA,

Спасибо Вам за помощь. Действительно ругается на отсутствие Moment.js.
Не смогу наверное сейчас его подключить - нужно сначала попросить разрешение у коллег :)

Буду копать дальше.
...
Рейтинг: 0 / 0
15.05.2015, 13:31
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959794
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
ProBiotekskyANA,

Спасибо Вам за помощь. Действительно ругается на отсутствие Moment.js.
Не смогу наверное сейчас его подключить - нужно сначала попросить разрешение у коллег :)

Буду копать дальше.Moment.js инсталлируется из NuGet. То есть не обязательно тянуть со стороннего CDN.
...
Рейтинг: 0 / 0
15.05.2015, 13:32
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959812
ProBiotek
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ProBiotek
Участник
Спасибо ) ох и сложная это штука, по первому времени )
...
Рейтинг: 0 / 0
15.05.2015, 13:53
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959839
ProBiotek
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ProBiotek
Участник
В общем все заработало.

Оказалось что кто-то в мастер-страницу ДВА раза добавил jQuery и датапикер.

Последний вопросик остался еще. Как сделать чтобы в поле убрать ВРЕМЯ, оставив только ДАТУ ?

{ viewMode: 'years' } отвечает за то, как будет выглядеть пиккер. А как изменить вывод текстового поля ?
...
Рейтинг: 0 / 0
15.05.2015, 14:14
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959977
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
ProBiotekВ общем все заработало.

Оказалось что кто-то в мастер-страницу ДВА раза добавил jQuery и датапикер.

Последний вопросик остался еще. Как сделать чтобы в поле убрать ВРЕМЯ, оставив только ДАТУ ?

{ viewMode: 'years' } отвечает за то, как будет выглядеть пиккер. А как изменить вывод текстового поля ?Для этого используйте datepicker, без time :) 17633007
...
Рейтинг: 0 / 0
15.05.2015, 15:45
| Ответить | Цитировать | Написать  
bootstrap-datetimepicker как ?
    #38959987
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
А если серъёзно, то читайте документацию по компоненту.
Код: javascript
1.
$('#Date').datetimepicker({ format: 'DD.MM.YYYY' });


http://jsfiddle.net/6105cfmc/1/
...
Рейтинг: 0 / 0
15.05.2015, 15:51
| Ответить | Цитировать | Написать  
25 сообщений из 30, страница 1 из 2
  1  все
Форумы / ASP.NET [игнор отключен] [закрыт для гостей] / bootstrap-datetimepicker как ?
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]