Dodaj niestandardowy html do etykiety pola wyboru w django

Question

Mam problem z wymogiem teraz, chcę dodać obraz do etykiety pola wyboru i naprawdę nie mam pojęcia, jak to zrobić. Używam kreatora formularza django do renderowania formularza. Oto obraz, który pokazuje, co chcę osiągnąć:

I tu jest to, co mam teraz (aby przyciski radiowe inline, wiem, można to osiągnąć poprzez CSS):

Oto forms.py:

from django import forms 
from django.utils.translation import gettext as _ 


CHOICES=[('0','Pay by card'), ('1','Invoice')] 




class PaymentForm(forms.Form): 
    title = 'payment' 
    payment_method = forms.ChoiceField(label = _("Payment Options"), choices=CHOICES, widget=forms.RadioSelect(), required = True) 

mam renderowania za pomocą formularza kreatora:

{{ wizard.form.payment_method.label_tag }} 
           {{ wizard.form.payment_method|safe }} 
           {{ wizard.form.payment.errors}} 

Ktoś ma jakieś sugestie do tego oprócz niestandardowego widżetu?

Answer 1

1) Krótko (ale nie jestem pewien) wywołać funkcję gdzie 'płatna kartą' i zwróć wszystkie potrzebne Ci <img>....

2) można dokonać somthing jak @Gahbu powiedział

3) Długi [Dobrze, myślę, ale niesprawdzone :(]: Zrób renderujący:

from myapp.my_widgets import CardsRadioFieldRenderer 

CARD_CHOICE = '0' 

CHOICES=[(CARD_CHOICE,'Pay by card'), ('1','Invoice')] 

class PaymentForm(forms.Form): 
    title = 'payment' 
    payment_method = forms.ChoiceField(label = _("Payment Options"), choices=CHOICES,widget=forms.RadioSelect(renderer=CardsRadioFieldRenderer), required = True) 

# myapp/my_widgets.py 

class CardRadioInput(RadioInput): 
    def __init__(self, name, value, attrs, choice, index): 
     self.name, self.value = name, value 
     self.attrs = attrs 
     choice_value = force_text(choice[0]) 
     self.choice_value = choice_value 
     if choice_value == CARD_CHOICE: 
      choice_label = force_text(self.get_html_for_card_choice()) 
     else: 
      choice_label = force_text(choice[1]) 
     self.choice_label = choice_label 
     self.index = index 

    def get_html_for_card_choice(self): 
     #some logic to get the images tags (<img ...> <img ...>) 
     return text 


class CardsRadioFieldRenderer(RadioFieldRenderer): 
    def __getitem__(self, idx): 
     choice = self.choices[idx] # Let the IndexError propogate 
     return CardRadioInput(self.name, self.value, self.attrs.copy(), choice, idx) 

Answer 2

W szablonie zrobić coś takiego:

{% for choice in wizard.form.payment_method.choices %} 
    {{ choice.0 }} {# value #} {{ choice.1 }} {# value #} 
    {% if choice.0 == PAYMENT_BY_PAYPAL %} 
    ... 
    {% endif %} 
{% endfor %} 

Można również napisać:

{% for key, value in wizard.form.payment_method.choices %} 
    {% if key == PAYMENT_BY_PAYPAL %} 
    ... 
    {% endif %} 
{% endfor %} 

Answer 3

Bez widget:

from django.utils.safestring import mark_safe 
CHOICES=[('0', mark_safe('Pay by card <img src="by_card.jpg"/>')), 
     ('1', mark_safe('Invoice <img src="no_card.jpg"/>')) 
] 

kredytowe: setting help_text for each choice in a RadioSelect

Answer 4

Jeśli chcesz TWE ak to z szablonu, musisz użyć "bezpiecznego", który mówi Jinji, aby tego nie umknęła. jak poniżej

{{ some_object.some_property|safe }} 

Jednak jeśli chcesz go używać wewnątrz kodu Pythona podczas definiowania forma/ModelForm wystarczy użyć mark_safe jak poniżej.

mark_up = 'this is a <a href="http://www.google.com">link</a>' 
choices = list() 
choices.append(('some_id', mark_safe(mark_up))) 
self.fields['some_field'].choices = choices