3

I am customizing the description field on the Project Quotes form (Screen PM304500). I need the description field to be multi-line and it must preserve new lines.

I have customized the field itself to allow for very long strings and I have customized the corresponding PXGridColumn with Multiline="true". With this I am able to edit the field value and with shift-enter I am able to insert newlines in the string. Also, the grid column, when not editing, will display the string on multiple lines, but new lines are ignored as if the value is being displayed as HTML. I know the newlines are preserved since, when I again edit the value, the newlines are present.

Further, I have been able to use the developer console in Chrome to drill down to the that results from the PXGridColumn. That is styled with "white-space: normal". If I change this to "white-space: pre-wrap" the column looks as I want it to.

I have also tried munging the value of the field to replace the newlines with
tags. Unfortunately, when I do this, I see the literal "
" in the value rather than a new line.

Ideally, I would like to just change the styling on the elements that result from the PXGridColumn to "white-space: pre-wrap". Is there an attribute/property for PXGridColumn that will allow me to do that? Alternatively, I would be okay with the replacing new lines with
approach if I could get the value to render as HTML. Of course, I am open to other approaches.

jasbill
  • 33
  • 3

2 Answers2

2

You can achieve this in the following way:

  1. Copy the Default folder in the App_Themes folder of Acumatica: enter image description here

  2. Open 00_Controls.css file in the copied folder and the css class below to the end of the file and save the file 

    .MyTable table:not([class~=GridRowForm]) tbody tr td{
    white-space: pre-wrap !important;
}

  3. In the Screen Editor select the Grid you want to have that white-space css style applied and add MyTable as CssStyle. enter image description here

  4. Now go to Site Preferences(SM200505) page and select Default - Copy as Interface Theme enter image description here

After these steps, you should be able to get the following UI in Sales Orders Details: enter image description here

Samvel Petrosov
  • 7,580
  • 2
  • 22
  • 46
  • Thank you Samvel. I actually had an epiphany to try this very thing before I saw your answer and it worked! Your answer, however, provides even better details than what I tried. – jasbill Jun 05 '19 at 20:15
2

As of Acumatica 2020 R1 (or perhaps earlier versions also), you can solve this by setting the Layout -> WrapText property to True on the Grid: Acumatica WrapText

Colin MacMillan
  • 21
  • 1