Line Breaks (<br/>) in UI Pages duplicating

[wollman1]

I'm trying to create a UI Page to display some information off the group form. However when I try to split a line using a <br/> tag, when it renders it is duplicated.

UI Page Code:

<j2:while test="$[groups.next()]">

  <tr>

      <td>$[groups.name]</td>

      <td>$[groups.u_escalation_on_call_contact]</td>

      <td>$[groups.manager.first_name] $[groups.manager.last_name]<br/>$[groups.manager.mobile_phone]</td>

      <td>$[groups.manager.manager.first_name] $[groups.manager.manager.last_name]<br/>$[groups.manager.manager.mobile_phone]</td>

  </tr>

</j2:while>

As Rendered:

<tr><td>Account &amp; Access Management</td><td>877-504-6342</td><td>Todd Sears<br></br>(617) 529-6965</td><td>Courtney Harwood<br></br>(617) 312-9865</td></tr>

How can I prevent this?

Thank you ahead of time

-Matt

[akt_snow]

Hi Matt,

try using pre-line property instead of <br/> : <td style="white-space:pre-line">

example:

<td style = "white-space:pre-line">groups.manager.manager.first_name

groups.manager.manager.last_name

groups.manager.manager.mobile_phone

</td>

-Avneet

[domaners]

Hi Matt,

Try adding the following into the top of your script:

<style>

br {

   line-height:0%;

}

</style>

If you alredy have a style declaration, add the middle three lines into there and ignore the top and bottom line above.

Cheers, Adam

[wollman1]

Adam and Avneet-

I tried both of your suggestions, and neither of them worked. Upon closer examination and on other examples, it seems that the XML rendering engine in ServiceNow splits a <br/> tag into <br></br>. Modern browsers seem to display that as <br><br>. Probably because many browsers try and ignore certain typos or human errors.

[Brad Tilton]

Hi Matt,

This is something that I run into regularly in ServiceNow doing cms sites. My usual solution is to wrap things in <p> tags to enforce a new line, so maybe something like this:

<j2:while test="$[groups.next()]">

   <tr>

       <td>$[groups.name]</td>

       <td>$[groups.u_escalation_on_call_contact]</td>

       <td>$[groups.manager.first_name] $[groups.manager.last_name]<br/>$[groups.manager.mobile_phone]</td>

       <td>

           <p>$[groups.manager.manager.first_name] $[groups.manager.manager.last_name]</p>

           <p>$[groups.manager.manager.mobile_phone]</p>

       </td>

   </tr>

</j2:while>