form-control 属性未调整为 bootstrap 模态模板
form-control attribute is not adjusting to bootstrap modal template
我正在尝试使用 angularjs 和 bootstrap 创建带有表单的模式。
首先,我创建了表单,现在我试图将其放入模式模板,但是表单控件正在滑出模式,如您在附件 link 中所见。
<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>
这是我得到的:
您的问题似乎出在 div
class,特别是 container
。我认为你应该尝试删除这一行:
<div class="container">
(当然还有它的结束标记:</div>
,看看它是否能解决您的问题。
让我知道是否有帮助。
我正在尝试使用 angularjs 和 bootstrap 创建带有表单的模式。 首先,我创建了表单,现在我试图将其放入模式模板,但是表单控件正在滑出模式,如您在附件 link 中所见。
<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>
这是我得到的:
您的问题似乎出在 div
class,特别是 container
。我认为你应该尝试删除这一行:
<div class="container">
(当然还有它的结束标记:</div>
,看看它是否能解决您的问题。
让我知道是否有帮助。