Dans un Django forme, comment puis-je rendre un bouton radio, de sorte que les choix sont séparés sur la page?

J'ai un Django forme avec deux choix de bouton radio élément. Je veux que le formulaire afin de rendre plus ou moins comme ceci:

( ) Je préfère la bière 
Le dernier événement sportif, j'ai assisté était: [ ] 
Mon préféré, le pilote de NASCAR est: [ ] 

( ) Je préfère le vin 
Le dernier opéra/jouer, j'ai assisté était: [ ] 
Mon auteur préféré est: [ ]

En d'autres termes, je veux diviser le bouton radio deux choix. Comment dois-je faire? En utilisant le formulaire par défaut.as_table rendu, les choix sont attirés l'un à côté de l'autre que je ne veux pas.

(Mes excuses à la NASCAR et l'opéra amateurs.)

OriginalL'auteur John Gordon | 2011-07-20

  1. 5

    J'ai fait un peu de creuser, et a trouvé un plomb dans la réponse à cette poste similaire qui pointe à un peu obsolète post dans django-users.

    D'emprunt du code de la as_widget() la méthode en forms.py j'ai façonné une méthode que je pourrais ajouter à mon formulaire afin de récupérer la RadioSelect du widget choix rendu au format HTML.

    class MyForm(forms.Form):
    MY_CHOICES = (
        ('opt0', 'Option zero'),
        ('opt1', 'Option one'),
    )
    myfield = forms.ChoiceField(widget=forms.RadioSelect, choices=MY_CHOICES)

    def myfield_choices(self):
        """
        Returns myfield's widget's default renderer, which can be used to 
            render the choices of a RadioSelect widget.
        """
        field = self['myfield']
        widget = field.field.widget

        attrs = {}
        auto_id = field.auto_id
        if auto_id and 'id' not in widget.attrs:
            attrs['id'] = auto_id

        name = field.html_name

        return widget.get_renderer(name, field.value(), attrs=attrs)

    Ensuite dans le modèle, vous pouvez accéder à une radio bouton de choix comme:

    <ul>
    <li>
        {{ myform.myfield_choices.0 }}
        My custom HTML that goes with choice 0 
    </li>
    <li>
        {{ myform.myfield_choices.1 }}
        Different HTML that goes with choice 1 
    </li>
</ul>

    ou 

    {% for choice in myform.myfield_choices %}
    <div>
        {{ choice }}
    </div>
{% endfor %}

    Je suis sûr que ce est une mauvaise idée. Il sera susceptible de s'arrêter de travailler à un point que django évolue. Il viole SEC en copiant le code de as_widget(). (TBH, je n'ai pas pris le temps de comprendre le code de as_widget) je l'utilise, à titre temporaire, hack. Peut-être il ya une meilleure façon qu'implique la coutume balises de modèle. Si oui, s'il vous plaît laissez-moi savoir.

    OriginalL'auteur Cole

  2. 4

    La RadioSelect widget de rendre sa sortie par défaut dans une liste non ordonnée.

    #forms.py
BEER = 0
WINE = 1
PREFERRED_DRINK_CHOICES = (
    (BEER, 'Beer'),
    (WINE, 'Wine'),
)

class DrinkForm(forms.Form):
    preferred_drink = forms.ChoiceField(choices=PREFERRED_DRINK_CHOICES,
                                        widget=forms.RadioSelect())

#views.py
def test(request):
    form = DrinkForm(request.POST or None)
    if request.method == 'POST':
        if form.is_valid():
            print 'form was valid'
    return render_to_response('test.html', {'form' : form},
        context_instance=RequestContext(request))

#test.html
<form action="." method="post" enctype="multipart/form-data">
    <ul>
        <li>
            {{ form.name.label_tag }}
            {{ form.name }}
            {{ form.name.errors }}
        </li>
        <li>
            {{ form.email.label_tag }}
            {{ form.email }}
            {{ form.email.errors }}
        </li>
        <li>
            {{ form.preferred_drink.label_tag }}
            {{ form.preferred_drink }}
            {{ form.preferred_drink.errors }}
        </li>
        <li>
        <input type="submit" value="Submit" />
        </li>
    </ul>
</form>

    Sera de sortie:

    <form enctype="multipart/form-data" method="post" action=".">
    <ul>
    <li>
            <label for="id_name">Name</label>
            <input type="text" maxlength="50" name="name" id="id_name">
    </li>
    <li>
        <label for="id_email">Email</label>
        <input type="text" id="id_email" name="email">
    </li>
    <li>
        <label for="id_preferred_drink_0">Preferred drink</label>
        <ul>
                    <li>
                        <label for="id_preferred_drink_0">
                            <input type="radio" name="preferred_drink" value="0" id="id_preferred_drink_0"> Beer</label>
                    </li>
                    <li>
                        <label for="id_preferred_drink_1"><input type="radio" name="preferred_drink" value="1" id="id_preferred_drink_1"> Wine</label>
                    </li>
                </ul>
        </li>
    <li>
        <input type="submit" value="Submit">
    </li>
    </ul>
</form>

    Rendu de chaque radio choix sur sa propre ligne. Vous aurez probablement besoin d'ajouter un peu de CSS pour obtenir le rendu juste la façon dont vous le souhaitez, mais cela devrait vous obtenez la structure dont vous avez besoin. Bien sûr, vous pouvez gagner de l'écriture du HTML à la main d'un just do...

    <form action="." method="post">
    <ul>
        {{ form.as_ul }}
        <li>
            <input type="submit" value="Submit" />
        </li>
    </ul>
</form>

    ...mais je préfère écrire mon code HTML à la main.

    Mais qui imprime toujours deux choix sur les lignes adjacentes, droit? Ce n'est pas ce que je suis en train de faire. Je veux avoir les deux boutons radio largement séparés, avec des blocs de champs en dessous de chacun, comme dans mon nascar/opéra exemple.
    Si vous écrivez le code HTML à la main, vous pouvez mettre d'autres champs ou de balisage où vous le souhaitez. à l'aide du formulaire.as_ul limite ce que vous pouvez faire.
    Quelle est la syntaxe pour effectuer le rendu d'un choix unique d'un multi-choix de la radio élément de bouton? {{form.preferred_drink}} rend tous les choix.
    C'est pas super facile de se rendre à un choix spécifique de niveau du modèle. Vous pouvez effectuer une itération sur les choix comme un dictionnaire: {% de la valeur, le texte en forme.preferred_drink.champ.choix %} {{ value }}, {{ texte }} {% finpour %} cependant, l'indexation n'est pas pris en charge au niveau du modèle pour obtenir le choix que vous voulez. Je voudrais vous recommandons de définir la variable pour le choix de la vue, ou la rédaction d'une balise de modèle à accepter le terrain et l'index de votre choix et ensuite rendre la saisie html.
    Juste pour ajouter une nouvelle feature de Django. Vous pouvez maintenant obtenir l'indice. {{ formulaire.preferred_drink.champ.choix.0 }} ('val', 'texte de l'étiquette'). Donc {{ formulaire.preferred_drink.champ.choix.0.0 }} affichera la valeur, et {{ formulaire.preferred_drink.champ.choix.0.1 }} imprimer le texte de l'étiquette.

    OriginalL'auteur Brandon