我有一个表单,用户只能有三个选择
表单有10个复选框项和一个自由文本输入。因此,用户有11个选项,用户只能从中选择三个:三个复选框,或两个复选框,并在文本区域中放置一些文本。
如果达到最多三个,或者如果用户选择在文本区域放置一些内容并选择两个复选框,则禁用其他复选框和文本区域,然后禁用其他八个复选框。
这是html模板:
<div class="form-group" ng-class="{'has-error':Form.jobtype.$dirty && Form.jobtype.$invalid, 'has-success':Form.jobtype.$valid}">
<label class="control-label" translate="jobdata.joblist.title">
Types of job
</label>
:<br/>
<div ng-repeat="topic in mylist.jobdata.joblist.jobitems">
<div > {{topic.item}}</div>
<ul >
<li ng-repeat="subitem in topic.subitems">
<input type="checkbox" name="jobtype"
ng-model="myModel.mychosenjobs[subitem.key]">
{{subitem.values | translate}}
</li>
</ul>
</div>
<div class="form-group" ng-class="{'has-error':Form.myfreetext.$dirty && Form.myfreetext.$invalid, 'has-success':Form.myfreetext.$valid}">
<p>or type it in yourself:</p>
<textarea type="text" class="form-control" name="myfreetext" placeholder="Enter the cooperation type (max of 100 characters)"
ng-model="myModel.mychosenfreetext" ng-minlength="5" ng-maxlength="100"></textarea>
<span class="error text-small block" ng-if="Form.myfreetext.$error.maxlength">Too long!</span>
<span class="error text-small block" ng-if="Form.myfreetext.$error.minlength">Too short!</span>
</div>
</div>
在代码中,我有两个ng-models
这是不理想的,因为我想在一个模型中捕获响应并将其保存在我的数据库中保存在一个地方。
如何组合上面的ng模型来捕获复选框和自由文本的响应并将其放在一个模型中?
如果有三个选项(其中一个选项也可以是文本区域),如何禁用其他复选框和自由文本?
答案 0 :(得分:2)
回答您的第一个问题:
在ArrayList
Collection.sort
键相同的模型
回答您的第二个问题:
使用freetext
添加方法myModel.mychosenjobs
来处理绑定到shouldDisable
指令的方法,如下所示。
<强> HTML 强>
$scope
<强> JS 强>
ng-disabled