Question

我正在Umbraco Backoffice中开发自定义部分，并且在必填字段验证方面遇到了一些麻烦。

如果未填写任何必填字段，我想防止单击表单按钮，然后显示该字段的验证消息。

这是我的表单代码

    <form name="evaluationForm" val-form-manager class="show-validation">
       <div class="ng-scope">
       <div class="umb-property ng-scope" data-element="property-questionTitle">
          <div class="control-group umb-control-group">
             <div class="umb-el-wrap">
                <label class="control-label ng-binding" for="questionTitle" title="questionTitle">
                Título <strong class="umb-control-required">*</strong>
                <small class="ng-binding">Añade un título a la pregunta.</small>
                </label>
                <div class="controls">
                   <div class="umb-property-editor ng-scope">
                      <div>
                         <div class="ng-scope">
                            <input name="questionTitle" type="text" class="umb-editor umb-textstring"
                       ng-model="vm.model.questionSelected.Title"
                       required />
                            <span class="help-inline" val-msg-for="questionTitle" val-toggle-msg="required">Required</span>
                         </div>
                      </div>
                   </div>
                </div>
             </div>
          </div>
       </div>
    <umb-button action="vm.functions.saveQuestion()"
          type="button"
          button-style="success"
          state="vm.buttonState"
          disabled="vm.buttonState === 'busy'"
          label="Guardar">
    </umb-button>
    </form>

Answer 1

您需要将disabled="vm.buttonState === 'busy'"的{{1}}属性更改为<umb-button>。

（其中disabled="evaluationForm.$invalid"是表单的名称，evaluationForm是表单的状态）

您还可以通过在您的$invalid中插入ng-show="evaluationForm.questionTitle.$dirty && evaluationForm.questionTitle.$invalid"来仅显示验证消息

（其中<span class="help-inline" val-msg-for="questionTitle" val-toggle-msg="required">Required</span>是表单的名称，evaluationForm是要检查的输入控件的名称）

Umbraco自定义部分验证必填字段

1 个答案: