Doesn't allow for multi column rows

[lachlansimpson]

If you have your form split vertically, then django-bootstrap-form fails, as the row declarations clash.

For example the following will not render correctly because the row has already been split.

<form action="" method="post">{% csrf_token %}.

    <div class="row">
        {{ form.non_field_errors }}
        <div class="col-md-6">
        <fieldset>
            <legend>Details</legend>
            {{ form.part_number | bootstrap_horizontal }}
            {{ form.grn | bootstrap_horizontal }}
            {{ form.job_number | bootstrap_horizontal }}
         </fieldset>
        </div>
        <div class="col-md-6">
        <fieldset>
            <legend>Cost and Quantity</legend>
            {{ form.serial_number | bootstrap_horizontal }}
            {{ form.qty | bootstrap_horizontal }}
            {{ form.cost | bootstrap_horizontal }}
        </fieldset>
        </div>
    </div><!-- end row div -->

<input type="submit" class="btn btn-default" value="Add or Update Carrier" />.
</form>

Note that adding a new row declaration doesn't seem to work either?:

 <div class="row">
        {{ form.non_field_errors }}
        <div class="col-md-6">
        <fieldset>
            <legend>Details</legend>
            <div class="row">
            {{ form.part_number | bootstrap_horizontal }}
            {{ form.grn | bootstrap_horizontal }}
            {{ form.job_number | bootstrap_horizontal }}
            </div>
         </fieldset>
        </div>
        <div class="col-md-6">
        <fieldset>
            <legend>Cost and Quantity</legend>
            <div class="row">
            {{ form.serial_number | bootstrap_horizontal }}
            {{ form.qty | bootstrap_horizontal }}
            {{ form.cost | bootstrap_horizontal }}
            </div>
        </fieldset>
        </div>
    </div><!-- end row div -->

[lachlansimpson]

Ok, I've discovered that adding row to the form-group div helps (done via element inspector in Chrome) but the -15 left margin makes it ugly. But it does help show the problem.

<div class="form-group row">
        <label class="control-label col-sm-2 col-lg-2" for="id_qty_at_new">Quantity at new</label>
        <div class=" col-sm-10 col-lg-10">
            <input class=" form-control" id="id_qty_at_new" name="qty_at_new" type="text">
        </div>
</div>

[epicserve]

I was able to get things looking the way I wanted using this method, so maybe things are fixed.

    <form action="." method="post">
        {% csrf_token %}

        {{ form.name|bootstrap }}
        {{ form.address|bootstrap }}
        <div class="row">
            <div class="col-md-8">
                {{ form.city|bootstrap }}
            </div>
            <div class="col-md-2">
                {{ form.state|bootstrap }}
            </div>
            <div class="col-md-2">
                {{ form.zip|bootstrap }}
            </div>
        </div>

        <button type="submit" class="btn btn-primary">{% if object.pk %}<span class="glyphicon glyphicon-edit"></span> Save{% else %}<span class="glyphicon glyphicon-plus"></span> Create{% endif %}</button>
        {% if object.pk %}
        <a href="{% url 'pse:opportunity_delete' object.pk %}" class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span> Delete</a>
        {% endif %}
    </form>