CalendarLegend to Mark the Calendar Dates

[former_member214868]

Hi Experts,

I am implementing an application where i need to mark the calendar dates like Week end and holiday.

I am using the controls Calendar and CalendarLegend from the sap.me library. I have the below code snippets and let me know how to connect the Legend to the Calendar.

var oLayout = new sap.ui.commons.layout.MatrixLayout({

  layoutFixed : true,

  columns : 2,

  width : "100%",

  widths : [ "70%", "30%" ]

  });

  //Header

  var oHeader = new sap.ui.commons.TextView({

  text:"WorkingRequest",

  design : sap.ui.commons.TextViewDesign.H1});

  oLayout.createRow({height: "40px"}, oHeader );

  //Calendar Control

  var oCalendar = new sap.me.Calendar("WorkRequestCalendar",

  {design: sap.me.CalendarDesign.Approval});

  // Properties

  oCalendar.setEnableMultiselection(true);

  oCalendar.setSingleRow(false);

  oCalendar.setMonthsToDisplay(2);

  oCalendar.setWeeksPerRow(1);

  oCalendar.setFirstDayOffset(1);

  oCalendar.setMonthsPerRow(2);

  var oLegend = new sap.me.CalendarLegend();

  oLegend.setExpanded(true);

  oLegend.setLegendForType01("Pending Approval");

  oLegend.setLegendForType04("Approved");

  oLegend.setLegendForType06("Rejected");

  var oCalendarCell = new

  sap.ui.commons.layout.MatrixLayoutCell({

  content:oCalendar,

  });

  oLayout.createRow(oCalendarCell,oLegend);

  return oLayout;

I am not sure how to mark the dates with some Legend. Please let know how to achieve this.

Regards,

Urmi

[scott_stefanich · Accepted solution]

Hello Urmi,

To set the date type, e.g. Approved, use method toggleDatesType of the sap.me.Calendar control.

I created a JS Bin sample which demonstrates using the method to set dates as Pending Approval, Approved, and Rejected.

Regards,

Scott

[former_member214868 · Accepted solution]

Thank you for the example you have provided in jsbin to explain this.

Regards,

Urmi

[former_member214868 · Accepted solution]

Hello Scott,

I am able to mark the Legends for the Calendar with the specific example.

One issue is, i need to make the Friday and Saturday for every week as Week off and Sunday as working day. In that case, the Calendar by default come with the week off color codings for Saturday and Sunday and setting the week off to Friday and Saturday works, but still Sunday is shown with the Legend for Week off/Non working day.

Please let me know how to make the sunday as a normal working day Legend and the Week offs legend should mark only the Friday and Saturdays.

Appreciate your response.

Thanks,

Urmi.