我需要在按钮单击事件上验证ui-select。当在ui-select中选择值时,只需要启用按钮。但问题是,按钮在不同的div控件之外,不使用表单标签(已经在div内使用另一个表单用于另一个动作)。我的示例代码如下:
<div class="form-group form-group-sm">
<label class="control-label text-xs col-xs-12 col-sm-5 col-md-4 ">Search :</label>
<div class="col-xs-12 col-sm-7 col-md-8 ">
<ui-select ng-model="cl.selected" theme="bootstrap" on-select="reload($item)" ng-disabled="disabled" title=""
required>
<ui-select-match placeholder="Filter by Client">{{$select.selected.clName}}</ui-select-match>
<ui-select-choices repeat="cl in cls | clFilter: {clName: $select.search, clNum: $select.search}">
<div ng-bind-html="cl.clName | highlight: $select.search"></div>
<small>
Cl Num : {{cl.clNum}}
</small>
</ui-select-choices>
</ui-select>
</div>
</div>
和按钮如下:
<ul class="list-inline pull-right">
<li>
<button id="clientSaveContinue" class="btn btn-primary btn-sm next-step"
ng-click="submitForm()">
Save and Continue
</button>
</li>
</ul>
那么,如何启用按钮点击任何ui-select值包含或使ui-select为必需
Not so much info =(
)建议在表单标签中使用submitForm(),而不是在按钮点击事件中使用
<form ng-submit="submitForm()"></form>
如果你不能在表单中使用按钮,你可以在表单中创建<input type="submit">
或<button type="submit">
(如果不存在),并使用某种链接指令。
'use strict';
import angular from 'angular';
function linked() {
return (scope, element, attrs) => {
var id = attrs['linked'];
element.on('click', function () {
document.getElementById(id).click();
return false;
});
}
}
export default angular.module('components', [])
.directive('linked', linked)
.name;
并使用它:
<form ng-submit="submitForm()">
...
<input type="submit" style="display: none" id="mySubmitId">
</form>
<button type="button" linked="mySubmitId">
再看ng-submit
指令