nice form

Plasmoxy · Aug 9, 2020 · 7d1894b · 7d1894b
1 parent 519964b
commit 7d1894b
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 3 deletions.
diff --git a/Frontend/Angular/budget-app/src/app/add-item-form/add-item-form.component.html b/Frontend/Angular/budget-app/src/app/add-item-form/add-item-form.component.html
@@ -1,4 +1,4 @@
-<form>
+<form #itemForm="ngForm" (ngSubmit)="onSubmit(itemForm)">
   <div class="field is-horizontal">
     <div class="field-body">
 
@@ -15,7 +15,7 @@
       </div>
 
       <div class="field is-narrow">
-        <button class="button is-primary">Add</button>
+        <button type="submit" class="button is-primary">Add</button>
       </div>
     </div>
   </div>

diff --git a/Frontend/Angular/budget-app/src/app/add-item-form/add-item-form.component.ts b/Frontend/Angular/budget-app/src/app/add-item-form/add-item-form.component.ts
@@ -1,4 +1,5 @@
 import { Component, OnInit } from '@angular/core';
+import { NgForm } from '@angular/forms'
 
 @Component({
   selector: 'app-add-item-form',
@@ -10,6 +11,11 @@ export class AddItemFormComponent implements OnInit {
   constructor() { }
 
   ngOnInit(): void {
+
+  }
+
+  onSubmit(form: NgForm) {
+    console.log(form)
   }
 
 }
diff --git a/Frontend/Angular/budget-app/src/app/app.module.ts b/Frontend/Angular/budget-app/src/app/app.module.ts
@@ -1,5 +1,6 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
+import { FormsModule } from '@angular/forms';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
@@ -18,7 +19,8 @@ import { BudgetItemCardComponent } from './budget-item-list/budget-item-card/bud
   ],
   imports: [
     BrowserModule,
-    AppRoutingModule
+    AppRoutingModule,
+    FormsModule,
   ],
   providers: [],
   bootstrap: [AppComponent]