Skip to Content
Menu
Musisz się zarejestrować, aby móc wchodzić w interakcje z tą społecznością.
To pytanie dostało ostrzeżenie
3 Odpowiedzi
4407 Widoki

I want to change position number field to left in list view odoo 16. I tried:   style="text-align: left" and type="char" but not working for me.

Awatar
Odrzuć
Autor

Thanks for your help. I have tried both ways ,but it's still not working. :((


Najlepsza odpowiedź

By default, Odoo aligns numeric fields to the right in both the header and body of tree views. To left-align a specific field, you can patch the ListRenderer and adjust the DOM once it's mounted.


Here’s how I solved it using JavaScript in Odoo 16+ (OWL architecture):


/** @odoo-module **/
import { patch } from "@web/core/utils/patch";
import { ListRenderer } from "@web/views/list/list_renderer";
import { onMounted } from "@odoo/owl";
patch(ListRenderer.prototype, "align_left_area_size", {
    setup() {
        this._super(...arguments);

        onMounted(() => {
            const headers = document.querySelectorAll('div[name="one2many_ids"] th[data-name="integer_field"]');
            const cells = document.querySelectorAll('div[name="one2many_ids"] td[name="integer_field"]');

            headers.forEach((el) => {
                el.classList.remove("text-end");
                el.style.textAlign = "left";
                const labelSpan = el.querySelector("span.text-end");
                if (labelSpan) {
                    labelSpan.classList.remove("text-end");
                    labelSpan.style.textAlign = "left";
                }
            });
            cells.forEach((el) => {
                el.style.textAlign = "left";
            });

            document.querySelectorAll('div[name="one2many_ids"] th[data-name="integer_field"] div.d-flex').forEach((div) => {
                div.classList.remove("text-end", "flex-row-reverse");
            });
        });
    },
});


This works for fields in nested One2many lists too, and you can adapt the selector for any other field. (I invite you to inspect the elements on your navigator to local better your field) 

Don't forget to add your file in the assets of your module's manifest.

I hope this helps!

Awatar
Odrzuć
Najlepsza odpowiedź

Hi

Try this inside a css file 

th.o_column_sortable[data-name="field_name"]

{

text-align: center;

}


Hope it helps

Awatar
Odrzuć
Najlepsza odpowiedź

Hi BB,

Try class="text-left",




Hope it helps.
Kiran K

Awatar
Odrzuć

<field name="date" class="text-left"/>
<field name="amount" class="text-right"/>

Powiązane posty Odpowiedzi Widoki Czynność
5
lis 23
42756
3
wrz 23
9334
1
wrz 22
3582
1
cze 22
12397
3
mar 20
10909