Background Color of clicked day in UniCalendarPanel1 / month-view

[erich.wanker]

Hello,

how can i change the Background Color of the actual selected day (which i clicked..) in UniCalendarPanel1 - MONTH VIEW ... ?

 

thanX

Erich

[Freeman35]

+1

[Sherzod]

19 hours ago, erich.wanker said:

how can i change the Background Color of the actual selected day (which i clicked..) in UniCalendarPanel1 - MONTH VIEW ... ?

Hello Erich,

Sorry, can you explain in more details?

[Freeman35]

On this thread, you can see, selected date 31 october 2018, in uniCalendar, on left side. How to show this selected day in uniCalenderPanel ?

for example, can you tell me, which day is selected day (cell) on screenshot ?

[Sherzod]

13 minutes ago, Freeman35 said:

can you tell me, which day is selected day (cell) on screenshot ?

Hi,

I don't need this, I just do a click where I need

[Freeman35]

yes, its a another view point

But we need it

[erich.wanker]

hi ..

same like Freeman35 wants ..

 

in your demo-app i clicked the "6 februar 2019" .. but the user can not see - what date is selected ...

the "actual selected date" should be highlighted .... 

[erich.wanker]

...  a other "dirty" solution:

i can draw a event on the clicked day ... very easy ... 

Please use a ChromeBrowser to see the video  to understand what i mean ....

[Sherzod]

30 minutes ago, erich.wanker said:

...  a other "dirty" solution:

i can draw a event on the clicked day ... very easy ... 

Sorry, I did not quite understand

[Sherzod]

1 hour ago, Freeman35 said:

On this thread, you can see, selected date 31 october 2018, in uniCalendar, on left side. How to show this selected day in uniCalenderPanel ?

Maybe something like this?

procedure SetBG(ACalendarPanel: TUniCalendarPanel; ADate: TDateTime);

procedure TMainForm.SetBG(ACalendarPanel: TUniCalendarPanel; ADate: TDateTime);
begin
  with ACalendarPanel do
  begin
    JSInterface.JSCode(#1'.getEl().select(''.x-calendar-weeks-cell'').elements.forEach(function(el){el.style["background-color"]=""});');
    JSInterface.JSAssign('selDate', [FormatDateTime('YYYY-mm-dd', ADate)]);
    JSInterface.JSCode('me='#1'.getEl().select(''.x-calendar-weeks-cell[data-date="''+'#1'.selDate+''"]'').elements[0]; if(me){me.style["background-color"]="green"};');
  end
end;

procedure TMainForm.UniCalendar1Click(Sender: TObject);
begin
  UniCalendarPanel1.StartDate := UniCalendar1.Date;
  SetBG(UniCalendarPanel1, UniCalendarPanel1.StartDate);
end;

procedure TMainForm.UniCalendarPanel1DateChange(Sender: TUniCalendarPanel;
  StartDate, ViewStart, ViewEnd: TDateTime);
begin
  UniCalendar1.Date := UniCalendarPanel1.StartDate;
  SetBG(UniCalendarPanel1, UniCalendarPanel1.StartDate);
end;

procedure TMainForm.UniCalendarPanel1ViewChange(Sender: TUniCalendarPanel;
  CurrentView: TUniCalendarViewType);
begin
  if CurrentView = cvMonth then
    SetBG(UniCalendarPanel1, UniCalendarPanel1.StartDate);
end;

...

[erich.wanker]

hi Sherzod,

works PERFECt !!

ThanX

[donlego]

how to focus on a specific date when form oncreate

example

color become green on 2nd date

the code is alway focus on first date