Author Topic: TreeView Text Alignment Requirement  (Read 1666 times)

Punit

  • Pro Ultimate
  • Jr. Member
  • *
  • Posts: 60
    • View Profile
TreeView Text Alignment Requirement
« on: February 04, 2026, 06:16:26 pm »
Hi Team,

In the TreeView, I have removed the wrap text option. After doing this, the text alignment is not starting from the required position.

The requirement is that the specific text in the TreeView should start exactly from its defined node starting point. Currently, once wrap text is removed, the text shifts and does not align properly with the TreeView structure.

Let me know if you have any solution.

Thanks & Regards,

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6552
    • View Profile
Re: TreeView Text Alignment Requirement
« Reply #1 on: February 04, 2026, 06:45:51 pm »
Could you please confirm which PGrid version you are using?

The screenshot you shared appears to be in text-wrap mode, so it’s difficult to understand the issue you’re facing after disabling wrap. Also, the hierarchy lines are not visible, which makes it unclear where the text is expected to start.

Please share two screenshots for clarity:
  • One with text-wrap enabled
  • One with text-wrap disabled

This comparison will help us better understand and assist you with the alignment issue.

Punit

  • Pro Ultimate
  • Jr. Member
  • *
  • Posts: 60
    • View Profile
Re: TreeView Text Alignment Requirement
« Reply #2 on: February 06, 2026, 11:28:30 am »
Hello,

I am using pqGrid version 10.1.0.

I have attached two screenshots for reference. Screenshot1 shows the grid with wrapped text, and Screenshot2 shows the grid without wrapped text. I would like to use the layout without wrapped text (as shown in Screenshot2).

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6552
    • View Profile
Re: TreeView Text Alignment Requirement
« Reply #3 on: February 06, 2026, 03:12:05 pm »
It’s actually the opposite: Screenshot1.png shows non-wrapped text, while Screenshot2.png shows wrapped text.

It looks like you want the indent to apply to wrapped lines as well, not just the first line.

To achieve that, you can use the treeModel.render callback to wrap the text in an inline-block element. For example:

Code: [Select]
treeModel: {
  render: function (ui) {
    return "<label>" + ui.cellData + "</label>";
  }
}

This allows the indentation to affect all lines when the text wraps.

Please let me know if this resolves the issue or if you’re still seeing unexpected behavior.