1

以下であり

フォーム.py:

GRADE_CHOICE=(
               ('1','Grade 1'),
               ('2','Grade 2'),
               ('3','Grade 3'),
               ('4','Grade 4'),
               ('5','Grade 5'),
               ('6','Grade 6') )

grades=forms.MultipleChoiceField(
               choices=GRADE_CHOICE,
               required=True, 
               widget=CheckboxSelectMultiple())

Template.html:

< divclass="controls">
{{ form.grades }}
< /div>

上記のコードは正常に機能し、テンプレートは正しいデータを表示します。ただし、データは 1 列または行ごとにのみ表示されます。

<ul>
    <li><label for="id_grades_0"><input type="checkbox" name="grades" value="1" id="id_grades_0" /> Grade 1</label></li>
    <li><label for="id_grades_1"><input type="checkbox" name="grades" value="2" id="id_grades_1" /> Grade 2</label></li>
    <li><label for="id_grades_2"><input type="checkbox" name="grades" value="3" id="id_grades_2" /> Grade 3</label></li>
    <li><label for="id_grades_3"><input type="checkbox" name="grades" value="4" id="id_grades_3" /> Grade 4</label></li>
    <li><label for="id_grades_4"><input type="checkbox" name="grades" value="5" id="id_grades_4" /> Grade 5</label></li>
    <li><label for="id_grades_5"><input type="checkbox" name="grades" value="6" id="id_grades_5" /> Grade 6</label></li>
</ul>

1 行に 3 つのレコードを表示するように変更する方法はありますか?

4

1 に答える 1

0

これは簡単な例であり、さまざまな方法で実現できます。

スタイル：

li.three  { width:33.333%;float:left;display:inline }

マークアップ:

<ul>
     <li class='three'>A</li>
     <li class='three'>B</li>
     <li class='three'>C</li>
     <li class='three'>D</li>
     <li class='three'>E</li>
     <li class='three'>F</li>
     <li class='three'>G</li>
     <li class='three'>H</li>
</ul>

#to add the style use the "attrs" kwarg.
grades=forms.MultipleChoiceField(
           choices=GRADE_CHOICE,
           required=True, 
           widget=CheckboxSelectMultiple(attrs={'class': 'three'}))

別の方法として、関数をカスタマイズすることもできますがrender、スタイルはよりシンプルであり、仕事を成し遂げることができます.

私は、ul に対してすべての li にクラスを持つマークアップに耐えられません。 render 関数をカスタマイズして、スタイルを ul と li に適用することもできます。

于 2013-01-22T02:36:58.137 に答える