使用Django Crispy Forms渲染单独的MultiWidget字段

前端之家收集整理的这篇文章主要介绍了使用Django Crispy Forms渲染单独的MultiWidget字段前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我的具体情况是我需要在一行中渲染这个字段(使用Bootstrap 3):

所以类似于:

  1. <div class="form-group">
  2. <label>Amount:</label>
  3. <div class="row">
  4. <input name="amount_0" type="number" class="col-xs-8">
  5. <select name="amount_1" class="col-xs-4">...</select>
  6. </div>
  7. </div>

使用:https://github.com/jakewins/django-money
小工具:https://github.com/jakewins/django-money/blob/master/djmoney/forms/widgets.py

模型:

  1. from djmoney.models.fields import MoneyField
  2.  
  3. class MyModel(models.Model):
  4. ...
  5. amount = MoneyField(...)
  6. ...

形成:

  1. class MyForm(forms.ModelForm):
  2. ...
  3. @property
  4. def helper(self):
  5. helper = FormHelper()
  6. helper.form_tag = False
  7.  
  8. helper.layout = Layout()
  9. helper.layout.fields = [
  10. ...
  11. 'amount',...
  12. ]
  13.  
  14. return helper
  15. ...

解决方法

django-crispy-forms不处理字段小部件的呈现,django处理它.与django.forms.MultiWidget相同.
django-crispy-forms不会单独渲染MultiWidget中的每个字段.

见:django.forms.MultiWidget.format_output(rendered_widgets)

这是如何在Django 1.10-中将MultiWidget呈现为twitter-bootstrap-3列:

  1. from djmoney.forms.widgets import MoneyWidget
  2.  
  3.  
  4. class CustomMoneyWidget(MoneyWidget):
  5. def format_output(self,rendered_widgets):
  6. return ('<div class="row">'
  7. '<div class="col-xs-6 col-sm-10">%s</div>'
  8. '<div class="col-xs-6 col-sm-2">%s</div>'
  9. '</div>') % tuple(rendered_widgets)
  10.  
  11.  
  12. class BookingForm(forms.ModelForm):
  13. ...
  14. def __init__(self,*args,**kwargs):
  15. super(BookingForm,self).__init__(*args,**kwargs)
  16.  
  17. amount,currency = self.fields['amount'].fields
  18.  
  19. self.fields['amount'].widget = CustomMoneyWidget(
  20. amount_widget=amount.widget,currency_widget=currency.widget)
  21. ...

对于Django 1.11:

由于change,您需要使用new template api.相反,您的自定义资金小部件应如下所示:

  1. class CustomMoneyWidget(MoneyWidget):
  2. template_name = 'widgets/money.html'

使用模板money.html

  1. <div class="row">
  2. <div class="col-xs-6 col-sm-10">
  3. {% with widget=widget.subwidgets.0 %}
  4. {% include widget.template_name %}
  5. {% endwith %}
  6. </div>
  7. <div class="col-xs-6 col-sm-2">
  8. {% with widget=widget.subwidgets.1 %}
  9. {% include widget.template_name %}
  10. {% endwith %}
  11. </div>
  12. </div>

猜你在找的Python相关文章