Question

我有3个输入和一个复选框。

前2个输入为必填项，并且只有在未选中此复选框的情况下才需要日期。

问题是，如果前两个输入中的任何一个无效，我想禁用提交按钮，并且我需要以某种方式检查该复选框是否未选中，我需要验证日期，如果已选中，那么我就不会需要日期。

我该怎么做？

<tr>
  <td><b>NEUE IBAN</b> <i class="required-asterix">*</i></td>
  <td class="form-group">
    <div class="col-xs-7 input-group">
      <span class="input-group-addon"><span><b>DE</b></span></span>
      <input validator="/^(\d *){20}$/" id="newIban" ng-keyup="vm.checkIBAN();" validator-invoke="watch" validator-error="fehlerhafte IBAN-Eingabe" ng-model="vm.NewReferenceAccount.newReferenceNumber" class="form-control" placeholder="Insert a new IBAN" required>
    </div>
  </td>
</tr>
<tr>
  <td><b>KONTOINHABER</b> <i class="required-asterix">*</i></td>
  <td class="form-group">
    <div class="col-xs-7 input-group">
      <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
      <input validator="/^[a-zA-Z ]+$/" validator-error="fehlerhafte KONTOINHABER-Eingabe" validator-invoke="watch" type="text" class="form-control" ng-model="vm.NewReferenceAccount.newAccountNameOwner" placeholder="Insert a new Account owner " required>
    </div>
    </div>
  </td>
</tr>
<tr>
  <td><b>GÜLTIG ab</b> <i class="required-asterix">*</i></td>
  <td>
    <input uib-tooltip="Check if it's current date" type="checkbox" ng-model="vm.NewReferenceAccount.isNotFutureDate" ng-init="vm.NewReferenceAccount.isNotFutureDate = true" />

    <div class="col-xs-7 input-group">
      <date-picker ng-model="vm.NewReferenceAccount.changeDate" uib-tooltip="Select the Change Date" ng-readonly="vm.NewReferenceAccount.isNotFutureDate" date-format="dd-MM-yyyy" date-parser-format="DD-MM-YYYY" required />
    </div>
  </td>
</tr>


  <button type="button" ng-disabled="??????????????????" ng-click="vm.acceptTicket();" uib-tooltip="Accept the ticket" class="btn btn-default btn-hover-success">Weiter&nbsp;<i class="glyphicon glyphicon-ok"></i></button>

Answer 1

您可以使用oninput事件在用户键入字段时验证第一个到字段，并相应地禁用/启用按钮。您可以在here中找到有关此事件以及如何使用它的更多信息。

对于复选框，您可以使用onchange事件，以便您知道用户单击时选择/取消选择该事件。有关onchange事件和用法示例的更多信息，请参见here

验证简单的可选输入

1 个答案: