Вызов функции проверки перед отправкой формы с использованием ngNativeValidate

Привет, я пытаюсь вызвать функцию проверки (ngNativeValidate) по нажатию кнопки.

Моя форма выглядит так:

<form #myForm="ngForm" (ngSubmit)="addEndpoint(myForm.value);" ngNativeValidate>
        <section class="form-block">
            <div class="form-group">
                <input type="text" placeholder="name" name="name" [(ngModel)]="myData.name" [hidden]="true">
            </div>
            </section>
        <button type="button" class="btn btn-outline" (click)="testEndpoint(myForm.value);">TEST CONNECTION</button>
        <button type="submit" class="btn btn-primary" [disabled]="disableSubmit">SUBMIT</button>
    </form>

Проверка работает, как ожидается, для SUBMIT кнопка. Я хочу такое же поведение даже для TEST CONNECTION кнопка. но не хочу отправлять форму. Как я могу это сделать? Я думаю, что будет какой-то способ просто вызвать функцию проверки по щелчку. Любая помощь приветствуется. Спасибо! заблаговременно.

РЕДАКТИРОВАТЬ: testEndpoint это бэкэнд-функция вызова

Источник

2 ответа

В реактивных формах вы можете использовать свойства "valid" и "touch" формы для отображения обратной связи с пользователем, если вы пытаетесь сделать с помощью кнопки "Test connection" проверку входных данных пользователя.

Таким образом, вы можете пропустить кнопку "Проверить соединение" и напрямую вывести следующий интервал, если форма недействительна и кнопка "Отправить" отключена:

<button type="submit" class="btn btn-primary" [disabled]="disableSubmit">SUBMIT</button>
<span *ngIf="!myForm.valid && myForm.touched" class="help-block">Please enter valid data!</span>

Надеюсь, поможет!

Источник

Я думаю, вот решение: Проверка ввода триггера

Итак, перейдите по этой ссылке, вы можете попробовать это:form.controls['myControl'].updateValueAndValidity();.

Вы также можете «проверить» полную форму. Нравиться:this.myForm.markAllAsTouched();

Веселиться!

Привет, Флориан

Источник
Другие вопросы по тегам