2

Django Crispy Forms から Floppy Forms に切り替えていますが、目的の Bootstrap スタイルが失われているようです。今では、スタイルのない単純なフォームのように見えます。

クリスピー

これは、Crispy Forms の Bootstrap テンプレート パックで私が持っていたものです。

ここに画像の説明を入力

生成されたソースは次のとおりです。

<div id="div_id_sent_amount" class="form-group has-error">
        <label for="id_sent_amount" class="control-label  requiredField">How much would you like to give?
        <span class="asteriskField">*</span>
        </label>
        <div class="controls ">
        <select class="select form-control" id="id_sent_amount" name="sent_amount"><option value="" selected="selected">---------</option><option value="0.00">$0.00</option><option value="0.05">$0.05</option><option value="0.10">$0.10</option></select>
        <span id="error_1_id_sent_amount" class="help-block"><strong>This field is required.</strong></span></div>
</div>

フロッピー

Bootstrap レイアウトを使用して Floppy で得られるものは次のとおりです。

ここにリンクの説明を入力

生成されたソースは次のとおりです。

<div class="form-group error">
    <label class="col-sm-4 control-label" for="id_sent_amount">Sent amount <span class="required">*</span>:</label>

        <div class="controls col-sm-8  field-sent_amount">
            <select id="id_sent_amount" name="sent_amount">
                 <option value="" selected="selected">---------</option>
                 <option value="0.00">$0.00</option>
                 <option value="0.05">$0.05</option>
                 <option value="0.10">$0.10</option>
            </select>
            <ul class="errorlist"><li>This field is required.</li></ul>

        </div><!--- .controls -->

私が欠けているものについてのアイデアはありますか?

4

1 に答える 1

2

floppyforms は簡単なレイアウトとウィジェット コントロールを提供するだけで、自動的にブートストラップ スタイルを有効にするわけではありません。

そのためには、ドキュメントで詳しく説明されているように、少し作業を行う必要があります。

要約すると、次のテンプレートを作成する必要があります。

  1. floppyforms/templates/floppyforms/layouts/bootstrap.html
  2. floppyforms/templates/floppyforms/rows/bootstrap.html
  3. floppyforms/templates/floppyforms/layouts/default.html
  4. floppyforms/templates/floppyforms/errors.html

それらをブートストラップ固有のスタイルで埋めます (例はドキュメントに記載されています)。

例は古いバージョンのブートストラップ用であることに注意してください。テンプレートを現在のバージョンの bootstrapで更新することをお勧めします。

テンプレートを手動で編集して最新のものにするか、またはdjango-floppyforms-bootstrap3その内容を正確に実行する which を使用して、bootstrap3 互換性のためにテンプレートを更新することができます。

于 2014-09-04T05:56:42.990 に答える