JQuery Datepicker - css

Question

Есть ли способ показать тип ввода месяца как номер (например, текстовое поле со стрелкой вверх и вниз) вместо выпадающего списка.

Пожалуйста, помогите нам в этом. Смотрите мое демо: https://jsfiddle.net/sharmilashree/VBGKU/1067/

.ui-datepicker-calendar tr { 
    text-align: center; 
    padding: 0; 
    background-color: #F6F6F6 
} 

Answer 1

Это будет трудно обойти. Это непросто сделать. Вот то, что я до сих пор:

https://jsfiddle.net/Twisty/ge6zh5es/6/

HTML

<p>Date: 
    <input type="text" id="datepicker" class="Highlighted" /> 
</p> 

JavaScript

$(function() { 
    var minYear = 2006, 
    maxYear = new Date().getFullYear(); 
    maxYear++; 
    var $dp = $("#datepicker").datepicker({ 
    changeYear: true, 
    dateFormat: "dd-mm-yy", 
    yearRange: minYear + ':' + maxYear, 
    }); 
    $dp.datepicker("setDate", "0"); 

    function changeSpinner($dpObj) { 
    var $yearSpin = $("<input>"); 
    $yearSpin.addClass("ui-datepicker-year"); 
    $yearSpin.attr({ 
     type: "number", 
     min: minYear, 
     max: maxYear, 
     value: new Date().getFullYear() 
    }).data("handler", "selectYear").data("event", "change"); 
    $yearSpin.on("change", function() { 
     console.log("Spinner Change Event."); 
     var pDate = $dpObj.datepicker("getDate"); 
     pDate.setFullYear(parseInt(this.value)); 
     console.log("New Date: " + pDate); 
     $dpObj.datepicker("setDate", pDate); 
    }); 
    console.info("Created Spinner: ", $yearSpin); 
    $dpObj.datepicker("widget").find(".ui-datepicker-year").replaceWith($yearSpin); 
    } 

    $("#datepicker").click(function() { 
    changeSpinner($dp); 
    }).change(function() { 
    changeSpinner($db); 
    }); 
}); 

Это работает только в первый раз. Сам datepicker не имеет никаких событий, которые я могу подключить для выполнения замены каждый раз. Я также должен добавить некоторые функции, чтобы этот новый элемент правильно работал с datepicker.

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