我正在尝试使用input-group
将这两个div组合在一起,因此看起来像这样,但是第一项是下拉选择。
现在看起来像什么
我听说使用这里的select引导程序不起作用。这可能在这里吗?
我怎样才能像第一个照片那样使两个彼此相邻?
附言请只看一下结构,我删除了专有的东西名称。
谢谢!
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="input-group">
<div class="col-md-4 col-sm-3" ng-init="vm.Current = vm.interval">
<select class="form-control" ng-model="vm.Current" ng-options="interval.set for interval in vm.intervals"></select>
</div>
<ng-form name="intervalsForm">
<div class="col-md-5 col-sm-9" ng-repeat="interval in vm.intervals" ng-show="vm.Current == interval">
<ng-form name="singleForm">
<input type="text" class="form-control" placeholder="HH:mm:ss" name="single" id="interval" ng-model="vm.Interval" ng-pattern="/^\d{2}:\d{2}:\d{2}$/" ng-class="{inputError: single.interval.$error.pattern && intervalForm.interval.$dirty || single.interval.$invalid || vm.settings.$submitted && intervalForm.interval.$invalid}" required/>
</ng-form>
</div>
</ng-form>
<span class="input-error-span" ng-show="(intervalsForm.$dirty || intervalsForm.$invalid) && intervalsForm.$invalid">{{ vm.validationMessages.intervalHHmm }}:ss</span>
</div>
最佳答案
您可以像下面这样:
.form-control .form-control {
border:0;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="input-group">
<span class="input-group-addon">
<select></select>
</span>
<input type="text" class="form-control">
</div>
尝试自定义您的代码,使其看起来像这样。
关于jquery - bootstrap 输入组未分组,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/38458151/