Skip to Content
This question has been flagged
1 Reply
4283 Views
Avatar
doug jenkins

Is there a way to add a vertical border on data tables in Odoo reporting?  

Avatar
Discard
Avatar
Paresh Wagh
Best Answer

Hi Doug:

You can do it using a CSS style. There are various ways to do it. If you want to change it in only one report, you can include the following inline style declaration to have the left and right borders of the cells rendered in solid black.

    <style>
      th, td { border-left: solid; border-right: solid; }
    </style>
For example, the table in the Sale Order pdf that looks like so out of the box



will look like this after the inline style is applied



EDIT:
Use the following to override the table css settings in your case:

    <style>
      .table, .table th, .table tr, .table td {
          border: 1px solid black !important;
      }
    </style>
Your table will look like so:





Avatar
Discard
doug jenkins
Author

Hi Paresh

This worked except when I tried to add the matching top and bottom border it did not provide borders for the column headers, nor did it provide a top border for the first result. Do you know what I am doing wrong?

<data>

<xpath expr="/t/t/div" position="inside">

<table class="table o_report_block_table">

<thead>

<tr>

<th>

<style>

th, td { border-left: solid; border-right: solid; }

th, td { border-top: solid; border-bottom: solid;}

</style>

<span>Name</span>

</th>

</tr>

</thead>

<tbody>

<tr t-foreach="doc.order_line" t-as="table_line">

<td>

<span t-field="table_line.display_name"/>

</td>

</tr>

</tbody>

</table>

</xpath>

<xpath expr="/t/t/div/table/thead/tr/th" position="after">

<th>

<span>Confirmed Width</span>

</th>

</xpath>

<xpath expr="/t/t/div/table/tbody/tr/td" position="after">

<td>

<span t-field="table_line.x_studio_confirmed_width"/>

</td>

</xpath>

<xpath expr="/t/t/div/table/thead/tr/th[2]" position="after">

<th>

<span>Confirmed Depth</span>

</th>

</xpath>

<xpath expr="/t/t/div/table/tbody/tr/td[2]" position="after">

<td>

<span t-field="table_line.x_studio_confirmed_depth"/>

</td>

</xpath>

</data>

Paresh Wagh

Hi Doug: I have edited my earlier post and added the CSS style you can use in your situation.

doug jenkins
Author

That worked! Thank you!

Faris Fathurrahman

I dunno why, but using the style on top of the page doesn't work, but by directly wrote the style inside each of the <td> tag, it works. In my case.