Android bug: datepicker display not changing when view changed to: Day, Week or Agenda. Only showing Month as default.

[Tonathiu]

Hello,

We have been using the scheduler. We want to report a bug that occurs on android devices. As seen in the screen below, the Formatted display datepicker (circled with blue). Should change depending weather the user clicks on : Week, Day, Today etc. Currently does not change the format. On desktop browser everything works fine.

Thank you,

Sincerely

Tonathiu.

Android

It should look lke this:

Desktop

[Hareesh Balasubramanian]

Hi Tonathiu, 

Greetings from Syncfusion Support. 

We have validated your reported query “the Formatted display datepicker (circled with blue). Should change depending weather the user clicks on : Week, Day, Today etc” at our end. And for that, we have prepared a sample using actionComplete and dataBound Scheduler event in that we can able to modify our date format as per our requirement. And the sample can be viewed from the following link. 

Code snippet: 

    onActionComplete(args) { 

      if (Browser.isDevice && args.requestType === "viewNavigate") { 

        this.dateFormat(); 

      } 

    }, 

    onBound() { 

      if (Browser.isDevice && this.$refs.bool) { 

        this.dateFormat(); 

        this.$refs.bool = false; 

      } 

    }, 

    dateFormat() { 

      let schObj = document.querySelector(".e-schedule").ej2_instances[0]; 

      let intl = new Internationalization(); 

      if (schObj.currentView === "Month") { 

        let dFormatter = intl.getDateFormat({ skeleton: "yMMM", type: "date" }); 

        let startDate = dFormatter(schObj.activeView.monthDates.start); 

        let text = startDate; 

        document.querySelector(".e-tbar-btn-text").innerText = text; 

      } else { 

        let dFormatter = intl.getDateFormat({ skeleton: "Md", type: "date" }); 

        let startDate = dFormatter(schObj.getCurrentViewDates()[0]); 

        let index = schObj.getCurrentViewDates().length - 1; 

        let dFormat = intl.getDateFormat({ skeleton: "d", type: "date" }); 

        let enddate = dFormat(schObj.getCurrentViewDates()[index]); 

        let dFormatEnd = intl.getDateFormat({ skeleton: "y", type: "date" }); 

        let enddateYear = dFormatEnd(schObj.getCurrentViewDates()[index]); 

        let text = 

          schObj.currentView === "Day" 

            ? startDate + "," + enddateYear 

            : startDate + "-" + enddate + "," + enddateYear; 

        document.querySelector(".e-tbar-btn-text").innerText = text; 

      } 

    } 

Sample: https://codesandbox.io/s/vue-template-0zk7q?file=/src/App.vue 

Kindly try the above sample and revert us if you have any further assistance. 

Regards, 

Hareesh 

[Tonathiu]

Thanks for the reply. I see what you have done, but it does not maintain the formated date when clicking the forward/backward arrows(for week, day etc views.) OR when using the timepicker.  See pics below for guidance. This only occurs on Android. 

Sincerely, 

Tonathiu 

[Hareesh Balasubramanian]

Hi Tonathiu, 

Sorry for the inconvenience caused. 

We have modified our previously updated sample using actionComplete event and the sample can be viewed from the following link. 

Code snippet: 

    onActionComplete(args) { 

      if (Browser.isDevice && ((args.requestType === "viewNavigate") || (args.requestType === "dateNavigate"))) { 

        this.dateFormat(); 

      } 

    } 

Sample: https://codesandbox.io/s/vue-template-j96vg?file=/src/App.vue 

Kindly try the above sample and revert us if you have any further assistance. 

Regards, 

Hareesh