How to Change TABLE Format in QWEB reports? With different table Border and Color.?

Odoo is the world's easiest all-in-one management software.
It includes hundreds of business apps:

CRM
e-Commerce
Accounting
Inventory
PoS
Project management
MRP

Take the tour

All Posts People Badges

Tags (View all)

odoo v14 accounting v15 odoo16features

About this forum

Help

How to Change TABLE Format in QWEB reports? With different table Border and Color.?

qweb reports

3 Replies

41410 Views

Chandni Gandhi

Tables types are already there in ODOO, like Condensed, bordered, etc.

I want to design my own table. Let me know any possible CSS or other way to do it.

Thanks,

Yenthe Van Ginneken (Mainframe Monkey)

Best Answer

Hi Chandni,

You can apply as much CSS as you want in Odoo. You can do this either inline (in the XML file) or by adding a new CSS file to your module.The inline code works just as if you write in HTML. A little example:

<table border="1" style="width:100%;"> 
  <tr style="font-weight:bold;">
    <td>Jill</td>
    <td>Smith</td>	
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>	
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>	
  </tr>
</table>

You can view a fiddle here: https://jsfiddle.net/cc72g35v/1/
If you want to work with a CSS file you can include it in your __openerp__py like this:

 { 
 'css': ['static/src/css/my_css.css'], 
 }

Yenthe

Chandni Gandhi

Thanks Yenthe. I refers your answers and questions often. You have a very good knowledge. Thanks again for answering. :)

PankaJ_Joshi

odoo guide is available to style your pdf Reports

check this out :)

http://odoo.guide/?s=report

Chandni Gandhi

Hello Pankaj, Already referred that page. Thanks for your time.

Karthik Arumugam

Hi Chandi

You can make use of all available table defined in the bootstrap.css

If you want to use your own design , it is possible by defining the css inside the style tag of you template

For example

<template id="student_test_report">

 <style type="text/css">

 .bb {

 font-weight: bold;

 .brr{

 border: 5px solid green;

 .tbt{

 border-top: 2px;

 border-color: black;

 border-width: thick;

 </style>

.....

.....

.....

</template>

I think this will help you.

Enjoying the discussion? Don't just read, join in!

Create an account today to enjoy exclusive features and engage with our awesome community!

Related Posts	Replies	Views
QWEB Report template has inconsistent row heights (see screenshot) qweb reports	0 Oct 24	144
Qweb reports inconsistent table row height qweb reports	0 Oct 24	5
images in report does not load qweb reports	1 May 23	1466
How to resolve text overlap of table header on qweb report? Solved qweb reports	5 May 21	9863
Qweb order array before iterating with foreach Solved qweb reports	5 Aug 20	29870

This question has been flagged

Enjoying the discussion? Don't just read, join in!