Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Bullets next to django multiple MultipleChoiceField

I have a form with 2 MultipleChoiceField's with the CheckboxSelectMultiple widget.

When rendered in the template the checkboxs have a "bullet points" to the left of each choice.

I'm thinking it has to do with the checkboxs rending as an but I'm not sure how to remove the bullet points?

Feedback is much appreciated.

Form

class GameScheduleForm(forms.Form):

    weight_training_days = forms.MultipleChoiceField(widget=forms.CheckboxSelectMultiple,
        choices=(
            (0, "MONDAY"),
            (1, "TUESDAY"),
            (2, "WEDNESDAY"),
            (3, "THURSDAY"),
            (4, "FRIDAY"),
            (5, "SATURDAY"),
            (6, "SUNDAY"),
        ),
    )

    cardio_training_days = forms.ChoiceField(widget=forms.CheckboxSelectMultiple,
        choices=(
            (0, "MONDAY"),
            (1, "TUESDAY"),
            (2, "WEDNESDAY"),
            (3, "THURSDAY"),
            (4, "FRIDAY"),
            (5, "SATURDAY"),
            (6, "SUNDAY"),
        ),
    )

Template

{% extends "fitgames/fitgames_base.html" %}

{% block content %}
<div class="row-fluid">
    <div class="well game span4 offset4">
        <div class="row-fluid">
            <h4 class="text-center">Total Body HIT</h4>
            <p class="text-center">Select the days you can workout</p>
        </div>
        <div class="row-fluid">
            <form method="post" action="{% url 'game_setup2_schedule' %}"> {% csrf_token %}
                <div><strong>Select 3 Weight Training Days</strong></div>
                <div>{{ form.weight_training_days}}</div>
                <div><strong>Select 3 Cardio Days</strong></div>
                <div>{{ form.cardio_training_days }}</div>
                <div><button class="btn btn-primary btn-large" type="submit">&nbsp;Next</button></div>
            </form>
        </div>
    </div>
</div>

{% endblock %}

like image 688
bbrooke Avatar asked Dec 19 '22 19:12

bbrooke


1 Answers

When forms.CheckboxSelectMultiple is rendered it is rendered in a ul tag . What you need to do is add the following to your css (making it more specific to that form as required):

ul
{
    list-style-type: none;
}
like image 191
Jeff_Hd Avatar answered Dec 22 '22 12:12

Jeff_Hd