diff --git a/Front/skydivelogs-app/src/app/app.module.ts b/Front/skydivelogs-app/src/app/app.module.ts index fc16a5b..3c4682f 100644 --- a/Front/skydivelogs-app/src/app/app.module.ts +++ b/Front/skydivelogs-app/src/app/app.module.ts @@ -23,7 +23,7 @@ import { ServiceApiGet } from '../services/service-api-get.service'; import { ServiceApiPost } from '../services/service-api-post.service'; import { ServiceComm } from '../services/service-comm.service'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; -import { FormsModule } from '@angular/forms'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { MatPaginatorModule, MatTableModule, @@ -72,6 +72,7 @@ const appRoutes: Routes = [ appRoutes, { enableTracing: true } // <-- debugging purposes only ), + ReactiveFormsModule, FormsModule, BrowserModule, BrowserAnimationsModule, diff --git a/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.css b/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.css index e69de29..76fefd6 100644 --- a/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.css +++ b/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.css @@ -0,0 +1,8 @@ +label { + display: inline-block; + width: 150px; +} + +input[type="text"] { + width: 200px; +} diff --git a/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.html b/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.html index 589d6b0..f027fbc 100644 --- a/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.html +++ b/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.html @@ -1 +1,7 @@ -

new-aircraft works!

+
+
+ + +
+ +
diff --git a/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.ts b/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.ts index 4aea12a..4b4daf8 100644 --- a/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.ts +++ b/Front/skydivelogs-app/src/app/new-aircraft/new-aircraft.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit } from '@angular/core'; +import { FormControl, FormGroup, Validators } from '@angular/forms'; @Component({ selector: 'app-new-aircraft', @@ -6,10 +7,21 @@ import { Component, OnInit } from '@angular/core'; styleUrls: ['./new-aircraft.component.css'] }) export class NewAircraftComponent implements OnInit { + public addForm: FormGroup; - constructor() { } + constructor() { + this.addForm = new FormGroup({ + aircraftName: new FormControl('', Validators.required) + }); + } ngOnInit() { } + onSubmit(formData) { + console.log(formData.status); + console.warn('New data : ', formData); + + this.addForm.reset(); + } } diff --git a/Front/skydivelogs-app/src/app/new-drop-zone/new-drop-zone.component.css b/Front/skydivelogs-app/src/app/new-drop-zone/new-drop-zone.component.css index e69de29..e347887 100644 --- a/Front/skydivelogs-app/src/app/new-drop-zone/new-drop-zone.component.css +++ b/Front/skydivelogs-app/src/app/new-drop-zone/new-drop-zone.component.css @@ -0,0 +1,12 @@ +label { + display: inline-block; + width: 150px; +} + +input[type="text"] { + width: 200px; +} + +input[type="email"] { + width: 200px; +} diff --git a/Front/skydivelogs-app/src/app/new-drop-zone/new-drop-zone.component.html b/Front/skydivelogs-app/src/app/new-drop-zone/new-drop-zone.component.html index b72eaf1..e22536f 100644 --- a/Front/skydivelogs-app/src/app/new-drop-zone/new-drop-zone.component.html +++ b/Front/skydivelogs-app/src/app/new-drop-zone/new-drop-zone.component.html @@ -1 +1,23 @@ -

new-drop-zone works!

+
+
+ + +
+
+ + +
+
+ +