summaryrefslogtreecommitdiff
path: root/recipeBuddy/src/app/add-recipe
diff options
context:
space:
mode:
authorTucker Evans <tuckerevans24@gmail.com>2019-12-07 13:32:21 -0500
committerTucker Evans <tuckerevans24@gmail.com>2019-12-08 15:03:07 -0500
commit4efaeb517b94690483a14f25a224de73c0f1b055 (patch)
tree8e4224e547633c050dad317d56c2e6426b8c0069 /recipeBuddy/src/app/add-recipe
parent75a82f8a40b9f296aa71a4b6cef0fa8ea8a1c591 (diff)
Add add recipe form requires a recipe name before submitting
Diffstat (limited to 'recipeBuddy/src/app/add-recipe')
-rw-r--r--recipeBuddy/src/app/add-recipe/add-recipe.component.html6
-rw-r--r--recipeBuddy/src/app/add-recipe/add-recipe.component.ts6
2 files changed, 8 insertions, 4 deletions
diff --git a/recipeBuddy/src/app/add-recipe/add-recipe.component.html b/recipeBuddy/src/app/add-recipe/add-recipe.component.html
index 36d45b6..a8a3e5f 100644
--- a/recipeBuddy/src/app/add-recipe/add-recipe.component.html
+++ b/recipeBuddy/src/app/add-recipe/add-recipe.component.html
@@ -1,7 +1,8 @@
<form [formGroup]="recipeForm" class="form" (ngSubmit)="onSubmit()">
<h2>Add Recipe</h2>
<mat-form-field class="full-width">
- <input matInput placeholder="Name" type="text" formControlName="recipeName">
+ <input matInput placeholder="Name" type="text"
+ formControlName="recipeName" required>
</mat-form-field>
<mat-form-field class="full-width">
<textarea matInput placeholder="Description"
@@ -83,5 +84,6 @@
</button>
</div>
</div>
- <button mat-flat-button color="primary" type="submit">Submit</button>
+ <button mat-flat-button color="primary" type="submit"
+ [disabled]="!recipeForm.valid">Submit</button>
</form>
diff --git a/recipeBuddy/src/app/add-recipe/add-recipe.component.ts b/recipeBuddy/src/app/add-recipe/add-recipe.component.ts
index cdd63c8..b4f4d1e 100644
--- a/recipeBuddy/src/app/add-recipe/add-recipe.component.ts
+++ b/recipeBuddy/src/app/add-recipe/add-recipe.component.ts
@@ -5,12 +5,13 @@ import { FormControl } from '@angular/forms';
import { FormBuilder } from '@angular/forms';
import { FormArray } from '@angular/forms';
+import { Validators } from '@angular/forms';
+
import { Recipe } from '../DataModels/recipe';
import { Ingredient } from '../DataModels/ingredient'
import { Step } from '../DataModels/step';
import { BackendService } from '../REST_service/backend.service';
-
@Component({
selector: 'app-add-recipe',
templateUrl: './add-recipe.component.html',
@@ -20,7 +21,7 @@ import { BackendService } from '../REST_service/backend.service';
export class AddRecipeComponent {
recipeForm = this.fb.group({
- recipeName: [''],
+ recipeName: ['', Validators.required],
desc: [''],
ingredients: this.fb.array([
this.fb.group({
@@ -40,6 +41,7 @@ export class AddRecipeComponent {
tags: [''],
photos: ['']
});
+
constructor(private fb: FormBuilder,
private restService: BackendService
) { }