form-control属性不适用于bootstrap模态模板

时间:2015-12-02 13:55:16

标签: angularjs modal-dialog angular-ui-bootstrap form-control

我正在尝试使用angularjs和bootstrap创建一个带有表单的模态。 首先我创建了表单,现在我尝试将其放到模态模板中,但是表单控件正在滑出模态,如您在链接中看到的那样。

<div class="modal-header">
    <h3 class="modal-title">Add New Review</h3>
</div>

<div class="modal-body">
    <form role="form">
        <fieldset>
            <legend>Basic Information</legend>
            <div class="container">
                <div class="form-group">
                    <label for="address">Address</label>
                    <input type="text" id="address" name="address" class="form-control col-sm-1"
                           ng-model="editableReview.address"
                           required>
                </div>`enter code here`
        </fieldset>
    </form>
</div>

<div class="modal-footer">
    <div class="col-sm-offset-10">
        <input type="button" class="btn btn-default" value="Cancel" ng-click="cancelForm()"/>
        <input type="submit" class="btn btn-primary" value="Submit" ng-click="submitForm()"/>
    </div>
</div>

这就是我得到的:

enter image description here

1 个答案:

答案 0 :(得分:0)

您的问题似乎与div类有关,特别是container。我想你应该尝试删除这一行:

<div class="container">

(当然是结束标记:</div>,看看它是否解决了您的问题 如果有帮助,请告诉我。