insert form into book

This commit is contained in:
2025-11-10 16:57:16 +01:00
parent 743c557553
commit 76b6f74086
3 changed files with 61 additions and 0 deletions

View File

@@ -0,0 +1,33 @@
<form nz-form nzLayout="horizontal" [formGroup]="authorForm" (ngSubmit)="submitForm()">
<nz-form-item>
<nz-form-label nzSpan="4" nzRequired>
Nom
</nz-form-label>
<nz-form-control nzSpan="20" nzErrorTip="Ce champ est requis">
<input nz-input placeholder="Nom" formControlName="name">
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label nzSpan="4" nzRequired>
Prénom
</nz-form-label>
<nz-form-control nzSpan="20" nzErrorTip="Ce champ est requis">
<input nz-input placeholder="Prénom" formControlName="firstname">
</nz-form-control>
</nz-form-item>
<nz-flex nzJustify="end">
<!-- <button nz-button nzType="primary" (click)="submitForm()">-->
<!-- Valider-->
<!-- </button>-->
<button nz-button nzType="primary" type="submit">
Valider
</button>
</nz-flex>
</form>
<button nz-button (click)="fillForm()">Simuler une récupération depuis le serveur</button>

View File

@@ -0,0 +1,28 @@
import { Component } from '@angular/core';
import {NzFormModule} from "ng-zorro-antd/form";
import {FormControl, FormGroup, Validators} from "@angular/forms";
@Component({
selector: 'app-create-book',
imports: [NzFormModule],
templateUrl: './create-book.html',
styleUrl: './create-book.css',
})
export class CreateBook {
createBookForm = new FormGroup({
title: new FormControl<string>(null, [Validators.required]),
releaseYear: new FormControl<string>(null, [Validators.required]),
author: new FormControl<string>(null, [Validators.required])
})
submitForm() {
// Pour annuler si le formulaire est invalide
if (this.createBookForm.invalid) return;
// Pour obtenir la valeur du formulaire
console.log(this.createBookForm.getRawValue())
// Pour vider le formulaire
this.createBookForm.reset()
}
}