Datepicker in semantic ui

Question

Есть ли датапик для семантического ui, например, bootstrap datepicker? Я искал их сайт. Но не удалось.

JQuery datepicker хорошо работает, но пользовательский интерфейс не выглядит красивым с моим проектом.

Answer 1

В это время написания, есть тянуть запрос ожидающий здесь:

https://github.com/Semantic-Org/Semantic-UI/pull/3256

Вот как это выглядит

https://jsbin.com/hubanufuva/1/edit?html,js,output

Answer 2

Я также огляделся по сторонам, но лучшее, что я мог найти, было Date Range Picker for Semantic UI.

Во время инициализации, вы можете получить графический интерфейс пользователя, чтобы посмотреть в основном семантический UI'ish с некоторыми пользовательскими классами:

// Initialize the daterangepicker 
$container.find('input').daterangepicker({ 
    buttonClasses: "ui mini button", 
    applyClass: "positive", 
    cancelClass: "cancel", 

    // ... 
    // ... 
    // ... 

    timePicker: true 
}); 

Answer 3

Посмотрите на этот Semantic UI Calendar module, который является результатом вышеупомянутого запроса на тягу. Много настроек и выглядит красиво.

<h3>Input</h3> 
<div class="ui calendar" id="example1"> 
    <div class="ui input left icon"> 
    <i class="calendar icon"></i> 
    <input type="text" placeholder="Date/Time"> 
    </div> 
</div> 

и

$('#example1').calendar(); 

Answer 4

Да есть, вы должны дать ваш входной атрибут типа даты,

<input type="date"> 

This как это выглядит как