diff options
| -rw-r--r-- | recipeBuddy/src/app/add-recipe/add-recipe.component.html | 6 | ||||
| -rw-r--r-- | recipeBuddy/src/app/add-recipe/add-recipe.component.ts | 6 |
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 ) { } |