Date Navigator – Marking & Date Legends – How to Do
Date Navigator – Marking & Date Legends – How to Do
Date Navigator can be very much useful in case of Time related applications. In one of my development related to the Leave application, has created a Calendar which has been marked with the Leave days, Holidays & Week offs with the Tooltip text mentioning the exact description along with the Legends which shows the meaning of the colors marked.
Date Navigator
Use the Data Navigator UI element and create a Date Navigator Marking Ui inside it.
Create a Legend UI element with a proper element id & Create a Multiple legend Item Ui inside it.
Now create the Context Node & Attributes for the Date Navigator & Legends
Field | Type |
Color | WDUI_TABLE_CELL_DESIGN |
Text | String |
Date | Datum |
- Bind the Date Navigator Marking UI with the DATE_MARKING Node & Attributes
Bind the Multiple Legend Item UI with the LEG_ITEMS Node & Attributes as below
Mention the name of the Legend element Id name in the legendid property of the Date navigator UI element
Write the necessary logic in WDDOINIT method to fill the internal table of the DATE_MARKING & LEG_ITEMS node to see the result in the UI. Please check the code give in the sample code section.
Now the UI will be displayed with the calendar UI with days marked in colors along with the Legends for the colors with Description
**** Legend Items Data filling *******
DATA lo_nd_leg_items TYPE REF TO if_wd_context_node.
DATA ls_leg_items TYPE wd_this->element_leg_items.
DATA lt_leg_items TYPE wd_this->elements_leg_items.
lo_nd_leg_items = wd_context->get_child_node(
name = wd_this->wdctx_leg_items ).
ls_leg_items-color = '05'.
ls_leg_items-text = 'Holidays'.
APPEND ls_leg_items TO lt_leg_items.
CLEAR: ls_leg_items.
ls_leg_items-color = '22'.
ls_leg_items-text = 'Flexi Days'.
APPEND ls_leg_items TO lt_leg_items.
CLEAR: ls_leg_items.
IF lo_nd_leg_items IS NOT INITIAL.
lo_nd_leg_items->bind_table(
new_items = lt_leg_items
set_initial_elements = abap_true ).
ENDIF.
***** Date Marking Data filling *******
DATA lo_nd_date_marking TYPE REF TO if_wd_context_node.
DATA ls_date_marking TYPE wd_this->element_date_marking.
DATA lt_date_marking TYPE wd_this->elements_date_marking.
lo_nd_date_marking =
wd_context->get_child_node(
name = wd_this->wdctx_date_marking ).
ls_date_marking-color = '22'.
ls_date_marking-text = 'Flexi Days'.
ls_date_marking-date = '20170919'.
APPEND ls_date_marking TO lt_date_marking.
CLEAR: ls_date_marking.
ls_date_marking-color = '22'.
ls_date_marking-text = 'Flexi Days'.
ls_date_marking-date = '20170920'.
APPEND ls_date_marking TO lt_date_marking.
CLEAR: ls_date_marking.
ls_date_marking-color = '05'.
ls_date_marking-text = 'HoliDay'.
ls_date_marking-date = '20170921'.
APPEND ls_date_marking TO lt_date_marking.
CLEAR: ls_date_marking.
ls_date_marking-color = '05'.
ls_date_marking-text = 'HoliDay'.
ls_date_marking-date = '20170922'.
APPEND ls_date_marking TO lt_date_marking.
CLEAR: ls_date_marking.
IF lo_nd_date_marking IS NOT INITIAL.
lo_nd_date_marking->bind_table(
new_items = lt_date_marking
set_initial_elements = abap_true ).
ENDIF.
Hope this helps. Cheers.
Thanks,
Nalla B
Dear Nalla,
Nice Blog. Thanks for sharing.
BR,
Srini
Thank you,
nice example . Works fine.
Well done
Mirek
Hi,
Thanks for the nice content. I tried the same in my system and the legend colors are missing. Attached image.
Example
Regards,
Shankar
Hi,
Please try passing the right color code. '05' / '22' mentioned below might not be supported in your landscape. Kindly check & pass the right value.
Hi,
I have unnecessary html text as well. Colors are missing in the legend and also unnecessary html text.
legend issue
Regards,
Shankar