Showing only month on jquery ui datepicker

I created a datepicker using jquery ui only showing months but it wasn't as I expect I don't want to list months on select I want to list them like this datepicker - if you going to click When you will see the list


        dateFormat: 'mm-yy',
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,

        onClose: function(dateText, inst) {  
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
            $(this).val($.datepicker.formatDate('yy-mm', new Date(year, month, 1)));

    $(".monthPicker").focus(function () {
            my: "center top",
            at: "center bottom",
            of: $(this)
<link href="" rel="stylesheet"/>

<script src=""></script>
<script src=""></script>

<label for="month">Month: </label>
<input type="text" id="month" name="month" class="monthPicker" />

Answers 1

  • If you don't mind, you can add some css to your page:

        display:none !important;

    And pre-handle the output of the datepicker if needed.

Related Articles