MonthPicker

Drop-downs provide a developer the ability to add a drop-down menu with specific properties to cells in a workbook. These drop-down menus don't require any extra code other than simply specifying which one to use for the drop-down menu.

SpreadJS has 9 different kinds of drop-downs, and this demo shows how to use the Month Picker.

You can use MonthPicker drop-down with the following code :

    // The way of click the dropdown icon to open MonthPicker. 
   var monthPickerStyle = new GC.Spread.Sheets.Style();
       monthPickerStyle.cellButtons = [
           {
               imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
               command: "openMonthPicker",
               useButtonStyle: true,
           }
       ];

       monthPickerStyle.dropDowns = [
           {
               type: GC.Spread.Sheets.DropDownType.monthPicker,
               option: {
                   startYear: 2009,
                   stopYear: 2019,
                   height: 300,
               }
           }
       ];
       sheet.setText(1, 5, "Month Picker");
       sheet.setStyle(2, 5, monthPickerStyle);

       // The way just open MonthPicker with command rather then clicking the dropdown button.
       spread.commandManager().execute({cmd:"openMonthPicker",row:2,col:11,sheetName:"Sheet1"});

There are several item in options that can customize the MonthPicker.

• startYear: number : Specify the month picker's start year, default value is ten year ago.
• stopYear: number : Specify the month picker's start year, default value is this year.
• height: number : Specify the DOM's height of month picker, default value is 300.