Hi,

I'm developing a custom section in Umbraco Backoffice and I having some troubles with required fields validation.

I want to prevent the click of the form button if any required field is unfilled, and then show the validation message for this field.

This is my form code

           <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>

Any help is appreciated.

John.