web-dev-qa-db-ja.com

TextAreaウィジェットのサイズを制御するDjango admin

Django adminインターフェイスでTextAreaウィジェットの外観を2つの異なる方法でオーバーライドできました。

formfield_overridesを使用する

admin.py

class RulesAdmin(admin.ModelAdmin):
formfield_overrides = {
    models.TextField: {'widget': Textarea(
                       attrs={'rows': 1,
                              'cols': 40})},
}

...
admin.site.register(Rules, RulesAdmin)

この方法は、そのモデルのすべてのTextFieldを変更するため、少しやり過ぎです。

カスタムフォームの場合:

forms.py

from Django.forms import ModelForm, Textarea
from TimePortal.models import Rules


class RulesModelForm(ModelForm):
    class Meta:
        model = Rules
        widgets = {
            'parameters': Textarea(attrs={'cols': 30, 'rows': 1}),
   }

admin.py

from AppName.forms import RulesModelForm

class RulesAdmin(admin.ModelAdmin):

    form = RulesModelForm

両方のソリューションは、TextAreaのサイズを変更します。ただし、どちらのソリューションでも、テキスト領域の実際のサイズは1行(実際には2行)以上です。レンダリングされたHTMLは次のようになります。

    <div class="form-row field-parameters">
            <div>
                <label for="id_parameters" class="required">Parameters:</label>
                <textarea id="id_parameters" rows="1" cols="30" name="parameters">{}</textarea> 
           <p class="help">Enter a valid Python Dictionary</p>
         </div>
    </div>

そして、ここにスクリーンショットがあります:

Form

テキスト領域のW3C参照 :によると

Textareaのサイズは、CSSのheightプロパティとwidthプロパティでも指定できます。

だから、私の質問は:

  • Django自身のcssテーマは、このウィジェットの「奇妙な」振る舞いを担当していますか?
  • この問題を解決する方法を提案できますか?
32
Oz123

これはブラウザ固有の問題です。

スレッドによると textareaの高さはFirefoxの行と一致しません

Firefoxは常にテキストフィールドの後に余分な行を追加します。一定の高さにしたい場合は、CSSを使用します...

Textareaのstyle属性を設定できます:

from Django.db import models
from Django.forms import Textarea

class RulesAdmin(admin.ModelAdmin):
    formfield_overrides = {
        models.TextField: {'widget': Textarea(
                           attrs={'rows': 1,
                                  'cols': 40,
                                  'style': 'height: 1em;'})},
    }

私のために働く-Firefox v。23およびChrome v。29。

お役に立てば幸いです。

34
alecxe