how to change TUniCalendarPanel day cell background color

[Freeman35]

Hello,

In V1420, I wanna change DayCell background color. I found this link in forum (Thanks to Muhammed)

http://forums.unigui.com/index.php?/topic/7893-calendarpanel-event-back-color/?hl=calendarpanel

 

You can use css "#", every cell has an ID, for example for cell: 05/02/2017:

#O13_id-month-day-20170205 {
background-color:#f00 !important;
} 

013 = UniCalendarPanel1.JSName

 

so you can use #id and assign css class as the color you want.

 

on my project :

#O12B_id-month-day-20171111 {
 background-color:red !important;
}

This work me. But, I have do change this css in runtime, becouse user can change year to any time, so no good idea add defined css file. I need for just mountview.

How to change TUniCalendarPanel's DayCell background color, And not all cell, If my condition result true (Exaple if daycell itemcount>0) then backround color will change

Thank you

 

[Sherzod]

Hi,

 

But, I have do change this css in runtime

 

I think, you can try to use:

 

"Ext.util.CSS.createStyleSheet" and "Ext.util.CSS.removeStyleSheet" for example...

UniSession.AddJS('Ext.util.CSS.createStyleSheet("'+
  '#O12B_id-month-day-20171111 {' +
  '  background-color: green !important;' +
  '}")');

[Freeman35]

Thank you so much, but have a problem. Please look at to screenshot. That Screenshot after use "removeStyleSheet". All style property removed.

 on this link I found

http://www.objis.com/formationextjs/lib/extjs-4.0.0/docs/api/Ext.util.CSS.html
 

updateRule( String/Array selector, String property, String value) : Boolean

Updates a rule property

 

Can be use this methot? if yes how to? I'm sorry I don't know javascript (I hope yet)

Thank you.

[Freeman35]

Yes, This code help me, I can change CSS item property or whatever name

UniSession.AddJS('Ext.util.CSS.updateRule("#'+UniCalendarPanel1.JSName+'_id-month-day-20171111","background-color","'+'red'+'");');

Thnak you very much Delphi developer.

[Sherzod]

Try to create style sheet with id (An id to add to the stylesheet for later removal)

createStyleSheet( cssText, id )

[Freeman35]

For Add:

UniSession.AddJS('Ext.util.CSS.createStyleSheet(" #'+UniCalendarPanel1.JSName+'_id-month-day-20171111 { background-color: green !important;}", "_20171111_")');

For remove:

UniSession.AddJS('Ext.util.CSS.removeStyleSheet("_20171111_");');

Thank you very much.

 

Just for learn, If I wanna write code in delphi

 

if  Ext.util.CSS.getvalue("_20171111_")

then UniSession.AddJS('Ext.util.CSS.updateRule("#'+UniCalendarPanel1.JSName+'_id-month-day-20171111","background-color","'+'red'+'");')

else UniSession.AddJS('Ext.util.CSS.createStyleSheet(" #'+UniCalendarPanel1.JSName+'_id-month-day-20171111 { background-color: green !important;}", "_20171111_")');

 

how to write this code in java script ?

Best regards.

[Freeman35]

Hi,

This codes not work in 1480, any solution about this?

thank you.

[charles13115255]

Hi,

This codes not work in 1.90.0.1568, any solution about this?

thank you.

[Sherzod]

Hello,

Also this post may help you: