2

I am switching from Django Crispy Forms to Floppy Forms, but my desired Bootstrap styling appears to be lost; now it just looks like a plain unstyled form.

Crispy

Here is what I had with Crispy Forms's Bootstrap template pack:

enter image description here

Here was the generated source:

<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>

Floppy

Here is what I get with Floppy using the Bootstrap layout here.

enter link description here

Here is the generated source:

<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 -->

Any ideas on what I am missing?

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它完全按照它所说的那样 - 更新模板以实现 bootstrap3 兼容性。

于 2014-09-04T05:56:42.990 回答