2017-01-20 4 views
0

Я строю свой внешний интерфейс с рамки MDL Google, и у меня возникают проблемы рендеринга Django формы с укладкой MDL, используя:Django форм и материалов Дизайн Lite

{{ form.as_table }} 
{{ form.as_p}} 
{{ form.as_ul}} 

Пытался таким образом также:

<form> 
     <div class="mdl-textfield mdl-js-textfield"> 
      {% for field in form %} 
      <label class="mdl-textfield__label" for="{{ field.name }}">{{ field.label_tag }}</label> 
      {{ field }} 
      {% endfor %} 
      <button type="submit" class="btn btn-primary">Submit</button> 
     </div> 
    </form> 

Мой Джанго класс формы:

class MyClassUpdateForm(forms.ModelForm): 
    class Meta: 
     model = MyClass 
     fields = '__all__' 
     widgets = { 
      'foo': TextInput(attrs={'class': "mdl-textfield__input"}), 
      'bar': TextInput(attrs={'class': "mdl-textfield__input"}), 
      'baz': TextInput(attrs={'class': "mdl-textfield__input"}), 
     } 

Я пытаюсь использовать этот блок кода из компонентов MDL в:

<form action="#"> 
    <div class="mdl-textfield mdl-js-textfield"> 
    <input class="mdl-textfield__input" type="text" id="sample1"> 
    <label class="mdl-textfield__label" for="sample1">Text...</label> 
    </div> 
</form> 
+0

try' {{form}} 'может быть? – Bobby

+0

Не работает ни Бобби ... Мне нужно сделать их вручную и каким-то образом применить стиль к каждому полю. –

+0

Попробуйте переопределить метод '__init__'' MyClassUpdateForm' и указать в нем attrs следующим образом: 'self.fields [ 'foo']. widget.attrs ['class'] = 'textfield__input'' – neverwalkaloner

ответ

0

Так я и сделал в своем проекте. Предполагая, что у вас есть модель, названная «формой», которая имеет атрибут «foo», то:

<form method="POST"> 
    <input class="mdl-textfield__input" type="text" id="id_{{ form.foo.name }}" name="{{ form.foo.name }}" value="{% if form.foo.value != None %}{{ form.foo.value }}{% endif %}" required> 
    <label class="mdl-textfield__label" for="id_{{ form.foo.name }}">Text...</label> 
</form>