Page 1 of 1

Background Color OptionGadget / CheckboxGadget

Posted: Tue Oct 06, 2020 7:25 am
by Dirk Geppert
Hi,

for the validation of Web forms I need the colouring of required fields.

For the OptionGadget and the CheckBoxGadget I use the following code:

Code: Select all

Procedure SetGadgetColorEx(Gadget, ColorType, Color)
  
  Protected GID = GadgetID(Gadget)
 
  Select GadgetType(Gadget)
      
    Case #PB_GadgetType_CheckBox
      Select ColorType
        Case #PB_Gadget_FrontColor
          ! $(v_gid.div).find(".dijitCheckBox").css("color", spider_helper_ColorToHtml(v_color));
        Case #PB_Gadget_BackColor
          ! $(v_gid.div).find(".dijitCheckBox").css("background-color", spider_helper_ColorToHtml(v_color));
      EndSelect
    
    Case #PB_GadgetType_Option
       Select ColorType
      ; .dijitCheckBox.dijitCheckBoxChecked
        Case #PB_Gadget_FrontColor
          ! $(v_gid.div).find(".dijitRadio").css("color", spider_helper_ColorToHtml(v_color));
         
        Case #PB_Gadget_BackColor
          ! $(v_gid.div).find(".dijitRadio").css("background-color", spider_helper_ColorToHtml(v_color));
      EndSelect
      
  EndSelect
  
EndProcedure

OpenWindow( 0, 0, 0, 500, 400, "Color Test")
CheckBoxGadget(0, 10, 10, 400, 30, "CheckBoxGadget()")
OptionGadget(1, 10, 50, 400, 30, "OptionGadget()")

SetGadgetColorEx(0, #PB_Gadget_BackColor, #Red)
SetGadgetColorEx(1, #PB_Gadget_BackColor, #Green)
Unfortunately only the box or the radio button is coloured. This is not very visible. How can I colour the whole gadget?

Re: Background Color OptionGadget / CheckboxGadget

Posted: Tue Oct 06, 2020 8:09 am
by Peter
try:

Code: Select all

! $(v_gid.div).css(...
instead of:

Code: Select all

! $(v_gid.div).find(...).css(...

Re: Background Color OptionGadget / CheckboxGadget

Posted: Tue Oct 06, 2020 10:40 am
by Dirk Geppert
Great! Thanks a lot, Peter!!

Code: Select all

Procedure SetGadgetColorEx(Gadget, ColorType, Color)
 
  Protected GID = GadgetID(Gadget)
 
  Select GadgetType(Gadget)
     
    Case #PB_GadgetType_CheckBox
      Select ColorType
        Case #PB_Gadget_FrontColor
          ! $(v_gid.div).css("color", spider_helper_ColorToHtml(v_color));
        Case #PB_Gadget_BackColor
          ! $(v_gid.div).css("background-color", spider_helper_ColorToHtml(v_color));
      EndSelect
   
    Case #PB_GadgetType_Option, #PB_GadgetType_CheckBox
       Select ColorType
        Case #PB_Gadget_FrontColor
          ! $(v_gid.div).css("color", spider_helper_ColorToHtml(v_color));
         
        Case #PB_Gadget_BackColor
          ! $(v_gid.div).css("background-color", spider_helper_ColorToHtml(v_color));
      EndSelect
     
  EndSelect
 
EndProcedure

OpenWindow( 0, 0, 0, 500, 400, "Color Test")
CheckBoxGadget(0, 10, 10, 400, 30, "CheckBoxGadget()")
OptionGadget(1, 10, 50, 400, 30, "OptionGadget()")

SetGadgetColorEx(0, #PB_Gadget_BackColor, #Red)
SetGadgetColorEx(1, #PB_Gadget_BackColor, #Green)

SetGadgetColorEx(0, #PB_Gadget_FrontColor, #Yellow)
SetGadgetColorEx(1, #PB_Gadget_FrontColor, #Yellow)