Listbox cell align web 2.0

Targets Web
1

Hello All,

Can anyone point me in the right direction to change the right/left/center justification on a WebListBox Column?

There’s another post from 2021 which is closed, and the references in the post no longer work.

Thanks,
Tim

2

Anyone?

I tried this code, but it didn’t help.

grdMasterGroups.AddRow( GroupID, GroupName,  Act )
grdMasterGroups.Style.Value("text-align") = "left"

So am doing the styling just following the AddRow method. No dice.
Tim

3

Take a look at WebListBoxStyleRenderer

4

Thank you Alberto.

Here’s the code that worked for me. This is done when the listbox is being filled up.

grdMasterGroups.AddRow( GroupID, GroupName,  Act )
Dim R As Integer = grdMasterGroups.LastAddedRowIndex

Var style As New WebStyle
style.Value("text-align") = "left"

'Create a renderer from the webstyle and some text
Var cellRenderer As New WebListBoxStyleRenderer(style, GroupID)

'Assign the renderer to the cell
grdMasterGroups.CellRendererAt(R,0) = cellRenderer
1 Like
5

Is there a way to do align the header text? If so how?

Tim

6

I saw a post about this but don’t know if OP was able to resolve it:

7

Yes, there is a way via java script, the key is to call it AFTER the data is returned. I have ended up implementing Thread control for each WebListBox driven by DataSource, so when the method in WebPage is called from the Session I call custom method to justify Column Header (Right or Center as Left is default). For each WebListBox I have class that has list aka array of column headers where I specify justification.
As I have mentioned in the post before, the header justification should match the cell text justification, so perhaps this will come out of the box some time in the future eliminating the need to use custom java script.

8

My guess is that Tim is not using DataSource, maybe the solution for him is a little different.

9

No, I am not using a built in data source. I read a db then insert the appropriate records in db read loop.

As the code shows, the cell renderer happens following addition of a row.

What code is necessary to change alignment of the column header(s)?

Thanks,
Tim

10

The JavaScript mentioned in the other thread.

Here the listbox is created in the Opening event, and the JavaScript needs to be in Shown event (didn’t work at the end of Opening event):

image
image1170×486 10.6 KB

11

I used the suggested code at the end of the process for adding a row and setting columns to left justified (in my case).

This code sets both the column and the header to left justified - in my case.

grdMasterGroups.AddRow( GroupID, GroupName,  Act )
Dim R As Integer = grdMasterGroups.LastAddedRowIndex

//---- Create the Style Object ----//
Var style As New WebStyle
style.Value("text-align") = "left"

'Create a renderer from the webstyle and some text
Var cellRenderer As New WebListBoxStyleRenderer(style, GroupID)

'Assign the renderer to the cell
grdMasterGroups.CellRendererAt(R,0) = cellRenderer


//---- Try this for Setting Column Headers ----//
Dim pColNum As Integer = 0
ExecuteJavaScript("var header = document.querySelector('#" + grdMasterGroups.ControlID + " thead th:nth-child(" + pColNum.ToString + ")');if (header) { header.classList.add('text-end'); }")

Tim