JAvaScript to set multiple properties

Targets Web
1

I am using XOJO 2021 r1.1 working on a WE app.

I have several Dialogs I want to change background color, corner radius, border color and border thickness without success.

I have attempted to use this syntax with several iterations to apply background color, radius and border property settings in Shown Event Handler of a Dialog without success. I always get radius but nothing else.

self.ExecuteJavaScript(“document.getElementById('”+Me.ControlID+“_body’).style{backgroundColor=‘#FFE796’, borderRadius=‘25px’, borderColor=‘red’}”)

What syntax should I use to accomplish?

2

This appears to be done best in the Opening event, and should be applied to the modal-content DOM object within the modal. You can do it in Shown, but it appears in the default style first.

Sub Opening() Handles Opening
  var exec() as String
  exec.Append( "var modalContent = $('#" + me.ControlID + " .modal-content');" )
  exec.Append( "modalContent.css({" )
  exec.Append( "  'background': '#FFE796'," )
  exec.Append( "  'border-radius': '25px'," )
  exec.Append( "  'border-color': 'red'" )
  exec.Append( "});" )
  
  ExecuteJavaScript( string.FromArray( exec, "" ) )
End Sub

If you wish all of your project’s modals to look this way, you should use a modified Bootstrap theme instead.

1 Like
3

@Anthony_G_Cyphers - thank you that was it.

1 Like