Hello Amrish,

There is another way to show the datepicker when an item is selected from the dropdown. When the grid is rendered add a click event to the dropdown, that opens the datepicker:

rendered: function (evt, ui) {
    $( $("ul-ui-menu.ui-widget")[5] ).click(function() {
        $( $("td[aria-describedby='grid1_SellStartDate']").find("div[role='button']") ).click();
    }
}

This way the datepicker will show up every time the dropdown is clicked (when an item of the list is selected).

I don't think it is possible to change the height of the year dropdown.

I am attaching a sample, using the code above.

Please feel free to contact me if you have any questions.

Regards,
Ivaylo Hubenov
Entry-level developer

Hello Ivaylo,

I think I wasnt clear with my question. Setting year range is fine, it works as expectd. I am willing to limit height of year dropdown to show only 10 items instead of 20.

Regards

Amrish S Kulkarni

Hello Ivaylo,

If I select same condition second time, it is not showing datepicker and I have to explicitly click on arrow button to get datepicker.

Regards

Amrish S Kulkarni

Hello Amrish,

You can set the year dropdown to show a custom number of years by adding the following code:

$("#grid1").data("igGridFiltering")._editors[5].field().datepicker("option", "yearRange", "c-10:c+10" });
//where "c" is the current year, which means "c-10:c+10" will show 10 years before and 10 years after the current year.

Feel free to contact me if you have further questions.

Regards,
Ivaylo Hubenov
Entry-level developer