it-swarm-eu.dev

Změňte šířku prvků formuláře vytvořených pomocí ModelForm v Django

Jak mohu změnit šířku elementu formuláře textarea, když jsem ho vytvořil?

Zde je moje třída produktů:

class ProductForm(ModelForm):
    long_desc = forms.CharField(widget=forms.Textarea)
    short_desc = forms.CharField(widget=forms.Textarea)
    class Meta:
        model = Product

A kód šablony ...

{% for f in form %}
    {{ f.name }}:{{ f }}
{% endfor %}

f je skutečný prvek formuláře ...

50
Josh Hunt

Nejjednodušší způsob použití případu je použití CSS. Je to jazyk určený k definování prezentace. Podívejte se na kód vygenerovaný formulářem, vezměte na vědomí ids pro pole, která vás zajímají, a změňte vzhled těchto polí pomocí CSS.

Příklad pole long_desc v produktu ProductForm (pokud formulář nemá vlastní předponu):

#id_long_desc {
    width: 300px;
    height: 200px;
}

Druhý přístup je předat klíčové slovo attrs vašemu konstruktoru widgetů.

class ProductForm(ModelForm):
    long_desc = forms.CharField(widget=forms.Textarea(attrs={'cols': 10, 'rows': 20}))
    short_desc = forms.CharField(widget=forms.Textarea)
    class Meta:
        model = Product

Je to popsáno v dokumentaci Django .

Třetí přístup je ponechat Nice deklarativní rozhraní newforms na chvíli a nastavit vaše atributy widgetu ve vlastním konstruktoru.

class ProductForm(ModelForm):
    long_desc = forms.CharField(widget=forms.Textarea)
    short_desc = forms.CharField(widget=forms.Textarea)
    class Meta:
        model = Product

    # Edit by bryan
    def __init__(self, *args, **kwargs):
        super(ProductForm, self).__init__(*args, **kwargs) # Call to ModelForm constructor
        self.fields['long_desc'].widget.attrs['cols'] = 10
        self.fields['long_desc'].widget.attrs['rows'] = 20

Tento přístup má následující výhody:

  • Atributy widgetu můžete definovat pro pole, která jsou automaticky generována z vašeho modelu bez předefinování celých polí.
  • Nezáleží na předponě formuláře.
105
zuber

Vynikající odpověď zuber, ale věřím, že je chyba v příkladu kódu pro třetí přístup. Konstruktor by měl být:

def __init__(self, *args, **kwargs):
    super(ProductForm, self).__init__(*args, **kwargs) # Call to ModelForm constructor
    self.fields['long_desc'].widget.attrs['cols'] = 10
    self.fields['long_desc'].widget.attrs['cols'] = 20

Objekty Field nemají žádné atributy attrs, ale jejich widgety.

15
bryan

V případě, že používáte doplněk, jako je Grappelli, který značně využívá stylů, můžete zjistit, že všechny přepsané atributy řádků a sloupců jsou ignorovány, protože voliče CSS fungují na vašem widgetu. To by mohlo nastat, pokud použijete vynikající přístup zubního lékaře druhého nebo třetího výše.

V tomto případě jednoduše použijte První přístup smíchaný buď s druhým nebo třetím přístupem nastavením atributu „styl“ namísto atributů „řádků“ a „colů“.

Zde je příklad úpravy init ve třetím přístupu výše:

def __init__(self, *args, **kwargs):
    super(ProductForm, self).__init__(*args, **kwargs) # Call to ModelForm constructor
    self.fields['short_desc'].widget.attrs['style'] = 'width:400px; height:40px;'
    self.fields['long_desc'].widget.attrs['style']  = 'width:800px; height:80px;'
6
bergdesign

Nastavte řádek a třídu css v zobrazení modelu administrátora:

'explicacion': AutosizedTextarea(attrs={'rows': 5, 'class': 'input-xxlarge', 'style': 'width: 99% !important; resize: vertical !important;'}),
0
Cubiczx