我有一个简单的引导程序表单。为了举例,我有一个输入字段和一个下拉列表。我想只在进行更改时启用保存按钮。为了做到这一点,我只在表单脏了时启用了保存按钮。
问题是 - 当我更改它的输入字段时,按钮被启用,当我更改下拉列表时,基本上选择列表项,表单不会将其识别为脏,因此它仍然是禁用。
有什么想法吗? 我还尝试创建一个隐藏的输入字段,每当选择值更新时它都会更新 - 但它仍然无法正常工作。
我的示例表单(请忽略任何拼写错误,因为我删除了大部分代码。功能正常工作。只是禁用按钮不起作用)
<form name="customizeForm" id="customize-form" class="bm-form" data-ng-cloak novalidate data-ng-submit="ctrl.saveCustomization(customizeForm.$valid)">
<!--if i change this input, it works -->
<input id="answer" type="text" name="answer" data-ng-model="ctrl.answer">
<!--If i change the below dropdown, it doesnt work and the button is still disabled -->
<div class="form-group dropdown col-xs-12 col-md-6" data-uib-dropdown data-keyboard-nav data-is-open="status[$index].isopen" data-ng-init="status[$index].newSelectedValue = ''">
<button id="profile-menu" type="button" class="form-control select-control dropdown-togglebtn" data-uib-dropdown-toggle>
<span class="selected" data-ng-bind-html="status[$index].newSelectedValue</span>
<span class="icon icon-down-arrow" aria-hidden="true"></span>
</button>
<ul class="dropdown-menu" role="menu" data-aria-labelledby="menu">
<li data-ng-repeat="answer in question.Answers">
<a href="" data-ng-click="status[$parent.$index].newSelectedValue = answer.AnswerDesc; ctrl.selectDropdownOption(question.QuestionId, answer.AnswerId)">{{answer.AnswerDesc}}</a>
</li>
</ul>
</div>
<div id="save-profile" class="text-center form-submit">
<button type="submit" data-ng-disabled="!customizeForm.$dirty" id="btn-profile-questionnaire" class="btn btn-card reverse" title="Save">
Save</span>
</button>
</div>
</form>