Web2 : enable multiline word-wrapping

Targets Web
1

Missing word-wrapping inside Web2 controls? Here are a few hacks/tricks I’ve found:

WebListBox text wrapping
Can be accomplished using http://documentation.xojo.com/api/user_interface/web/weblistbox.htmlStyleRenderer

// add a custom WebListBoxStyleRenderer 
  Var style As New WebStyle
  style.BackgroundColor = Color.Yellow
  style.BorderColor = Color.Green
  style.BorderThickness = 3
  Style.Bold = True
  style.Value("padding") = "1px"
  style.Value("white-space") = "normal"
  'Create a renderer from the webstyle and some text
  Var cr As New WebListBoxStyleRenderer(style,  "Now is the time for all good people to come to the aid of their burbclave")
  ListBox1.AddRow ""      
  ListBox1.CellValueAt(lb.LastAddedRowIndex, columNumber) = cr

WebRadioButtonGroup text wrapping
Can be accomplished using http://documentation.xojo.com/api/user_interface/web/webcontrol.html#webcontrol-executejavascript

Public Sub EnableWordWrap(extends rg as WebRadioGroup)
  dim CRLF as string = EndOfLine.Windows
  
  // uses querySelectorAll - see https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll
  dim js as string = _
  "var labels = document.querySelectorAll('#" + rg.ControlID + " > div > div > label'); " + CRLF + _
  "for (var i = 0 ; i < labels.length ; i++ ) {" + CRLF + _
  "  labels[i].classList.remove('text-nowrap'); "  + CRLF + _
  "}" + CRLF
  
  rg.ExecuteJavaScript(js)
End Sub
6 Likes
2

@Mike_D Brilliant, thank you!

3

Thanks for the code.
It is useful!

I just happened to want to do that in the WebListBox.