In the AFTER DISPLAY paragraph of your basic code you will need code similar to the following:
CASE SCREEN.NO = "DAYPICKER"
PICKER.HEADING = "Please select the day on which you wish to visit"
AJX.FUNC = "DP" ;* dbDayPicker
AJX.DATAIN = "delivery" ;* ID of the <div> container in the RD page to be used for the day picker
AJX.DATAIN<3,1,-1> = 'startDate' ; AJX.DATAIN<4,1,-1> = DATE()
AJX.DATAIN<3,1,-1> = 'endDate' ; AJX.DATAIN<4,1,-1> = DATE()+90
AJX.DATAIN<3,1,-1> = 'selectedDate' ; AJX.DATAIN<4,1,-1> = '""'
AJX.DATAIN<3,1,-1> = 'pickerTitle' ; AJX.DATAIN<4,1,-1> = PICKER.HEADING
AJX.DATAIN<3,1,-1> = 'displayDate' ; AJX.DATAIN<4,1,-1> = '27-Oct-2020'
AJX.DATAIN<3,1,-1> = 'disabledArray' ; AJX.DATAIN<4,1,-1> = '["14-Nov-2020","12-Nov-2020"]'
AJX.DATAIN<3,1,-1> = 'customAttributeArray' ; AJX.DATAIN<4,1,-1> = '[3001, 9010, 2111, 3101, 1100]'
* hiddenId is the ID of the hidden field added to the RD page to pass data back to the database
AJX.DATAIN<3,1,-1> = 'onselect' ; AJX.DATAIN<4,1,-1> = 'function ($el, d) {}'
AJX.DATAIN<3,1,-1> = 'onanimate' ; AJX.DATAIN<4,1,-1> = 'function (b) { }'
AJX.DATAIN<3,1,-1> = 'hiddenID' ; AJX.DATAIN<4,1,-1> = 'hiddenId'
CALL DBI.G.AJXCMD(AJX.FUNC,AJX.DATAIN)
In the VALIDATION paragraph of your basic code you will need code similar to the following:
CASE EVENTSOURCE="DEM.WORK1.WK" AND SCREEN.NO = "DAYPICKER"
AJX.FUNC = "DPSH" ;* dbDayPickerSetHTML
AJX.DATAIN = "delivery" ;* ID of the <div> container in the RD page to be used for the day picker
AJX.DATAIN<3,1,-1> = '<div style="color:green;">You have selected date: ':DBVALUE:'</div>'
CALL DBI.G.AJXCMD(AJX.FUNC,AJX.DATAIN)
The day picker display is shown below.