Index: trip-planner-front/src/app/_models/dto/plannerDto.ts
===================================================================
--- trip-planner-front/src/app/_models/dto/plannerDto.ts	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/_models/dto/plannerDto.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -1,11 +1,13 @@
+import { Location } from "../location";
+
 export class PlannerDto{
     name: string;
     description: string;
-    locationList: any[];
+
 
     constructor(){
         this.name = '';
         this.description = '';
-        this.locationList = [];
+      
     }
 }
Index: trip-planner-front/src/app/_models/dto/plannerLocationDto.ts
===================================================================
--- trip-planner-front/src/app/_models/dto/plannerLocationDto.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
+++ trip-planner-front/src/app/_models/dto/plannerLocationDto.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -0,0 +1,10 @@
+
+export class PlannerLocationDto {
+    locationId: number;
+    plannerId: number;
+
+    constructor(){
+     this.locationId = 1;
+     this.plannerId = 1;
+    }
+}
Index: trip-planner-front/src/app/_services/location.service.ts
===================================================================
--- trip-planner-front/src/app/_services/location.service.ts	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/_services/location.service.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -2,4 +2,6 @@
 import { Injectable } from "@angular/core";
 import { Observable } from "rxjs";
+import { PlannerLocationDto } from "../_models/dto/plannerLocationDto";
+import { Location } from "../_models/location";
 
 @Injectable({
@@ -9,5 +11,5 @@
     constructor(private httpClient : HttpClient){}
 
-    getLocationsFromCity(cityId: number, companionId: number, lengthOfStay: number, categoryIds: string): Observable<Object[]>{
+    getLocationsFromCity(cityId: number, companionId: number, lengthOfStay: number, categoryIds: string): Observable<Location[]>{
         let url = "http://localhost:8080/api/city/locations";
         return this.httpClient.get<Location[]>(url + '?cityId=' + cityId + '&companionId=' + companionId + '&lengthOfStay=' + lengthOfStay + '&categoryIds='+ categoryIds);
@@ -18,3 +20,13 @@
         return this.httpClient.get<Location[]>(url + '?regionId=' + regionId + '&companionId=' + companionId + '&lengthOfStay=' + lengthOfStay + '&categoryIds='+ categoryIds);
     }
+
+    postLocationToPlanner(plannerLocationDto : PlannerLocationDto) : Observable<Location>{
+        let url = "http://localhost:8080/api/add-location";
+        return this.httpClient.put<Location>(url, plannerLocationDto);
+    }
+
+    getLocationsFroPlanner(plannerId : number) : Observable<Location[]>{
+        let url = "http://localhost:8080/api/planner/locations";
+        return this.httpClient.get<Location[]>(url + '?plannerId=' + plannerId);
+    }
 }
Index: trip-planner-front/src/app/_services/planner.service.ts
===================================================================
--- trip-planner-front/src/app/_services/planner.service.ts	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/_services/planner.service.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -9,6 +9,8 @@
 })
 export class PlannerService{
+    
     constructor(private httpClient: HttpClient){
     }
+
     getAllPlanners():Observable<Planner[]>{
         let url = "http://localhost:8080/api/planners";
@@ -16,5 +18,5 @@
     }
 
-    postInitialPlanner(planner: Planner, locationList: Location[]): Observable<Object>{     
+    postInitialPlanner(planner: Planner): Observable<Object>{     
         let url = "http://localhost:8080/api/planner/new";
         return this.httpClient.post<Planner>(url, planner);
@@ -30,3 +32,5 @@
         return this.httpClient.get<Planner>(url);
     }
+
+
 }
Index: trip-planner-front/src/app/app.component.ts
===================================================================
--- trip-planner-front/src/app/app.component.ts	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/app.component.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -13,3 +13,5 @@
   ngOnInit(): void {
   }
+
+ 
 }
Index: trip-planner-front/src/app/app.module.ts
===================================================================
--- trip-planner-front/src/app/app.module.ts	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/app.module.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -28,4 +28,5 @@
 import { EditPlannerComponent } from './planner/edit-planner/edit-planner.component';
 import { DetailPlannerComponent } from './planner/detail-planner/detail-planner.component';
+import { AddLocationToPlannerPanelComponent } from './location/add-location-to-planner-panel/add-location-to-planner-panel.component';
 
 @NgModule({
@@ -37,5 +38,6 @@
     LocationsFormComponent,
     EditPlannerComponent,
-    DetailPlannerComponent
+    DetailPlannerComponent,
+    AddLocationToPlannerPanelComponent
     ],
   imports: [
Index: trip-planner-front/src/app/create-initial-planner/create-initial-planner.component.ts
===================================================================
--- trip-planner-front/src/app/create-initial-planner/create-initial-planner.component.ts	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/create-initial-planner/create-initial-planner.component.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -18,12 +18,10 @@
   planner: Planner;
   planners: Planner[];
-  locations : Location[];
   plannerDto: PlannerDto;
 
-  constructor(public dialogRef: MatDialogRef<CreateInitialPlannerComponent>,
+  constructor(private dialogRef: MatDialogRef<CreateInitialPlannerComponent>,
               private plannerService : PlannerService, private router : Router) {
                 this.planner = new Planner;
                 this.planners = [];
-                this.locations = [];
                 this.plannerDto = new PlannerDto();
               }
@@ -40,5 +38,5 @@
   onFormSubmitPlanner(form: NgForm){
    console.log(this.planner);
-      this.plannerService.postInitialPlanner(this.planner, this.locations).subscribe(
+      this.plannerService.postInitialPlanner(this.planner).subscribe(
         data=>{
           console.log(data);
Index: trip-planner-front/src/app/location/add-location-to-planner-panel/add-location-to-planner-panel.component.html
===================================================================
--- trip-planner-front/src/app/location/add-location-to-planner-panel/add-location-to-planner-panel.component.html	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
+++ trip-planner-front/src/app/location/add-location-to-planner-panel/add-location-to-planner-panel.component.html	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -0,0 +1,15 @@
+<form  >
+    <h1 mat-dialog-title>Please select a planner where u want your location to be saved</h1>
+   
+<table class="table" >
+  <tbody>
+    <tr *ngFor="let planner of planners">
+      <td>{{planner.name}}</td>
+      <td><button mat-raised-button color="primary" (click)="onFormSavePlanner(planner.id)">Save</button></td>
+    </tr>
+   
+  </tbody>
+</table>
+  </form>
+  
+  <button mat-button (click)="onCancelClick()">Cancel</button>
Index: trip-planner-front/src/app/location/add-location-to-planner-panel/add-location-to-planner-panel.component.ts
===================================================================
--- trip-planner-front/src/app/location/add-location-to-planner-panel/add-location-to-planner-panel.component.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
+++ trip-planner-front/src/app/location/add-location-to-planner-panel/add-location-to-planner-panel.component.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -0,0 +1,65 @@
+import { Component, OnInit } from '@angular/core';
+import { NgForm } from '@angular/forms';
+import { MatDialogRef } from '@angular/material/dialog';
+import { ActivatedRoute } from '@angular/router';
+import { PlannerLocationDto } from 'src/app/_models/dto/plannerLocationDto';
+import { Location } from 'src/app/_models/location';
+import { Planner } from 'src/app/_models/planner';
+import { LocationService } from 'src/app/_services/location.service';
+import { PlannerService } from 'src/app/_services/planner.service';
+
+@Component({
+  selector: 'app-add-location-to-planner-panel',
+  templateUrl: './add-location-to-planner-panel.component.html',
+  styleUrls: ['./add-location-to-planner-panel.component.css']
+})
+export class AddLocationToPlannerPanelComponent implements OnInit {
+
+  planners: Planner[];
+  location: Location;
+  plannerId: number;
+  locationId: number;
+  plannerLocationDto: PlannerLocationDto;
+
+  constructor(private dialogRef: MatDialogRef<AddLocationToPlannerPanelComponent>, private plannerService: PlannerService,
+    private locationService: LocationService, private route: ActivatedRoute) {
+    this.planners = [];
+    this.location = new Location;
+    this.plannerId = 1;
+    this.locationId = 1;
+    this.plannerLocationDto = new PlannerLocationDto();
+  }
+
+  ngOnInit(): void {
+    this.plannerService.getAllPlanners().subscribe(
+      data => {
+        this.planners = data;
+      }
+    );
+
+
+    this.route.queryParams
+      .subscribe(params => {
+        this.locationId = params.locationId;
+      }
+      );
+  }
+
+  onCancelClick(): void {
+    this.dialogRef.close();
+
+  }
+
+  onFormSavePlanner(plannerId: number) {
+    console.log("PLANNER ID: " + plannerId);
+    console.log("LOC ID "+ this.locationId);
+    this.plannerLocationDto.locationId = this.locationId;
+    this.plannerLocationDto.plannerId = plannerId;
+    this.locationService.postLocationToPlanner(this.plannerLocationDto).subscribe(
+      data => {
+        console.log(data);
+      }
+    );
+  }
+
+}
Index: trip-planner-front/src/app/location/location.component.html
===================================================================
--- trip-planner-front/src/app/location/location.component.html	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/location/location.component.html	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -1,27 +1,23 @@
-<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"
+  integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
 
 <h3>Here are all locations</h3>
 
-<div class="container">
-  <table mat-table  class="mat-elevation-z8">
-
-    <!--- Note that these columns can be defined in any order.
-          The actual rendered columns are set as a property on the row definition" -->
-  
-    <!-- Position Column -->
-    <ng-container matColumnDef="position">
-      <th mat-header-cell *matHeaderCellDef> Location name </th>
-      <td mat-cell *matCellDef="let element">  </td>
-    </ng-container>
-  
-  
-    <!-- Symbol Column -->
-    <ng-container matColumnDef="symbol">
-      <th mat-header-cell *matHeaderCellDef> Symbol </th>
-      <td mat-cell *matCellDef="let element">  </td>
-    </ng-container>
-  
-    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
-    <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
-  </table>
-</div>
+<table class="table" >
+  <thead>
+    <tr>
+      <th scope="col">#</th>
+      <th scope="col">Location name</th>
+      <th scope="col"> Add to my planner</th>
+      <th scope="col">See details </th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr *ngFor="let location of listLocations">
+      <td>{{location.id}}</td>
+      <td>{{location.name}}</td>
+      <td><button mat-raised-button color="primary" (click)="openDialogSave(location.id)">Add to my planner</button></td>
+      <td><button mat-raised-button color="primary">See details</button></td>
+    </tr>  
+  </tbody>
+</table>
Index: trip-planner-front/src/app/location/location.component.ts
===================================================================
--- trip-planner-front/src/app/location/location.component.ts	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/location/location.component.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -1,11 +1,10 @@
-import { Component, OnInit } from '@angular/core';
-import { Category } from '../_models/category';
-import { City } from '../_models/city';
-import { Companion } from '../_models/companion';
-import { Country } from '../_models/country';
-import { CategoryService } from '../_services/cateogry.service';
-import { CityService } from '../_services/city.service';
-import { CompanionService } from '../_services/companion.service';
-import { CountryService } from '../_services/country.service';
+import { Route } from '@angular/compiler/src/core';
+import { Component, Input, OnInit, Output } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { MatDialog } from '@angular/material/dialog';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Location } from '../_models/location';
+import { LocationService } from '../_services/location.service';
+import { AddLocationToPlannerPanelComponent } from './add-location-to-planner-panel/add-location-to-planner-panel.component';
 
 @Component({
@@ -16,10 +15,68 @@
 export class LocationComponent implements OnInit {
 
-  constructor() {
-    
-   }
-   
+  form: FormGroup;
+  categoryIds: string;
+  cityId: number;
+  companionId: number;
+  lengthOfStay: number;
+  listLocations: any[];
+  cityOption: boolean = false;
+  regionOption: boolean = false;
+  regionId: number;
+
+  constructor(private fb: FormBuilder, private route: ActivatedRoute, private locationService: LocationService,
+    private router: Router, private dialog: MatDialog) {
+    this.form = fb.group({
+      title: fb.control('initial value', Validators.required)
+    });
+    this.cityId = 1;
+    this.companionId = 1;
+    this.lengthOfStay = 1;
+    this.categoryIds = '';
+    this.listLocations = [];
+    this.regionId = 1;
+  }
+
   ngOnInit(): void {
-   
+
+    this.route.queryParams
+      .subscribe(params => {
+        console.log(params);
+        this.cityId = params.cityId;
+        this.regionId = params.regionId;
+        this.companionId = params.companionId;
+        this.lengthOfStay = params.lengthOfStay;
+        this.categoryIds = params.categoryIds;
+      }
+      );
+
+    if (this.route.snapshot.queryParams['cityId']) {
+      this.locationService.getLocationsFromCity(this.cityId, this.companionId, this.lengthOfStay, this.categoryIds).subscribe(
+        result => {
+          console.log(result);
+          this.listLocations = result;
+        }
+      );
+    } else
+      if (this.route.snapshot.queryParams['regionId']) {
+        console.log("I am in region console");
+        this.locationService.getLocationsFromRegion(this.regionId, this.companionId, this.lengthOfStay, this.categoryIds).subscribe(
+          result => {
+            console.log(result);
+            this.listLocations = result;
+          }
+        );
+      }
+
   }
+
+  openDialogSave(locationId: number){
+    console.log(locationId);
+      const dialogRef = this.dialog.open(AddLocationToPlannerPanelComponent, {
+        width: '250px',
+        data: {}
+      });
+      this.router.navigate(['locations'], {queryParams: {locationId: locationId}});
+  }
+
 }
Index: trip-planner-front/src/app/locations-form/locations-form.component.html
===================================================================
--- trip-planner-front/src/app/locations-form/locations-form.component.html	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/locations-form/locations-form.component.html	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -1,62 +1,72 @@
-<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"
+  integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
 
-<div class="example-form">
 
-  <div class="form-group">
-    <button class="btn" (click)="chooseCityOption()" >
-      City
-    </button>
-    <button class="btn" (click)="chooseRegionOption()">
-      Region
-    </button>
-  </div>
-  <br>
-  <br>
+    <div class="example-form">
 
-  <div *ngIf="cityOption">
-    <label><h5>Please select a city</h5></label>
-    <mat-form-field appearance="fill" class="example-full-width">
-      <mat-label>Please select a city</mat-label>
-      <mat-select [(ngModel)]="cityId" placeholder="Select city">
-        <mat-option [value]="city.id" *ngFor="let city of cities" [value]="city.id"> {{city.name}}</mat-option>
-      </mat-select>
-    </mat-form-field>
-  </div>
+      <div class="form-group">
+        <button class="btn" (click)="chooseCityOption()">
+          City
+        </button>
+        <button class="btn" (click)="chooseRegionOption()">
+          Region
+        </button>
+      </div>
+      <br>
+      <br>
+  
+      <div *ngIf="cityOption">
+        <label>
+          <h5>Please select a city</h5>
+        </label>
+        <mat-form-field appearance="fill" class="example-full-width">
+          <mat-label>Please select a city</mat-label>
+          <mat-select [(ngModel)]="cityId" placeholder="Select city" name="city">
+            <mat-option [value]="city.id" *ngFor="let city of cities" > {{city.name}}</mat-option>
+          </mat-select>
+        </mat-form-field>
+      </div>
+  
+      <div *ngIf="regionOption">
+        <label>
+          <h5>Please select a region</h5>
+        </label>
+        <mat-form-field appearance="fill" class="example-full-width">
+          <mat-label>Please select a region</mat-label>
+          <mat-select [(ngModel)]="regionId" placeholder="Select region" name="region">
+            <mat-option [value]="region.id" *ngFor="let region of regions" [value]="region.id"> {{region.name}}
+            </mat-option>
+          </mat-select>
+        </mat-form-field>
+      </div>
+  
+      <h5>Who are you travelling with? </h5>
+      <mat-form-field appearance="fill" class="example-full-width">
+        <mat-label>Please select a companion</mat-label>
+        <mat-select [(ngModel)]="companionId" placeholder="Please select a companion" name="company">
+          <mat-option [value]="companion.id" *ngFor="let companion of companions">{{companion.type}}</mat-option>
+        </mat-select>
+      </mat-form-field>
+  
+      <h5>How many days are you willing to stay ?</h5>
+      <mat-form-field class="example-full-width" appearance="fill">
+        <mat-label>Please select a number of days</mat-label>
+        <input matInput placeholder="No. Days" type="number" min="1" value="0" max="30" [constraintMaxNumberDays()]
+          [(ngModel)]="lengthOfStay" name="nomdays" [value] = "lengthOfStay">
+      </mat-form-field>
+  
+      <h5>What are your priorities to visit?</h5>
+      <mat-chip-list selectable multiple>
+        <mat-chip #c="matChip" selected *ngFor="let category of categories" (click)="toggleSelection(c, category)"
+          [ngClass]="{'yellow' : toggle}" name="chips">
+          <mat-icon *ngIf="!c.selected">check</mat-icon>
+          {{category.name}}
+        </mat-chip>
+      </mat-chip-list>
+      <br>
+      <button mat-raised-button color="primary" (click)="createMyPlanner()">Create my planner</button>
+  
+    </div>
 
-  <div *ngIf="regionOption">
-    <label><h5>Please select a region</h5></label>
-    <mat-form-field appearance="fill" class="example-full-width">
-      <mat-label>Please select a region</mat-label>
-      <mat-select [(ngModel)]="regionId" placeholder="Select region">
-        <mat-option [value]="region.id" *ngFor="let region of regions" [value]="region.id"> {{region.name}}</mat-option>
-      </mat-select>
-    </mat-form-field>
-  </div>
 
-  <h5>Who are you travelling with?  </h5>
-  <mat-form-field appearance="fill" class="example-full-width">
-    <mat-label>Please select a companion</mat-label>
-    <mat-select [(ngModel)]="companionId" placeholder="Please select a companion">
-      <mat-option [value]="companion.id" *ngFor="let companion of companions">{{companion.type}}</mat-option>
-    </mat-select>
-  </mat-form-field>
-
-  <h5>How many days are you willing to stay ?</h5>
-  <mat-form-field class="example-full-width" appearance="fill">
-    <mat-label>Please select a number of days</mat-label>
-    <input matInput placeholder="No. Days"  type="number" min="1" value="0" max="30" [constraintMaxNumberDays()] [(ngModel)]="lengthOfStay">
-  </mat-form-field>
-
-   <h5>What are your priorities to visit?</h5> 
-  <mat-chip-list  selectable multiple >
-    <mat-chip #c="matChip" selected *ngFor="let category of categories" 
-    (click)="toggleSelection(c, category)" [ngClass]="{'yellow' : toggle}">
-  <mat-icon *ngIf="!c.selected" >check</mat-icon>
-  {{category.name}}
-  </mat-chip>
-  </mat-chip-list>
-  <br>
-  <button mat-raised-button color="primary" (click)="createMyPlanner()">Create my planner</button>
-
-</div>
   
Index: trip-planner-front/src/app/locations-form/locations-form.component.ts
===================================================================
--- trip-planner-front/src/app/locations-form/locations-form.component.ts	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/locations-form/locations-form.component.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -1,20 +1,20 @@
-import { Component, Injectable, OnInit } from '@angular/core';
-import { FormControl, NgForm } from '@angular/forms';
-import {map, startWith, switchMap} from 'rxjs/operators';
-import {forkJoin, Observable} from 'rxjs';
+import { Component, EventEmitter, OnInit, Output } from '@angular/core';
+import { FormBuilder, FormControl } from '@angular/forms';
+import { map, startWith, switchMap } from 'rxjs/operators';
+import { Observable } from 'rxjs';
 import { CityService } from '../_services/city.service';
 import { City } from '../_models/city';
-import { Country } from '../_models/country';
-import { CountryService } from '../_services/country.service';
 import { Companion } from '../_models/companion';
 import { CompanionService } from '../_services/companion.service';
 import { Category } from '../_models/category';
 import { CategoryService } from '../_services/cateogry.service';
-import {CdkDragDrop, moveItemInArray} from '@angular/cdk/drag-drop';
 import { MatChip } from '@angular/material/chips';
 import { LocationService } from '../_services/location.service';
 import { Region } from '../_models/region';
 import { RegionService } from '../_services/region.service';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Params, Router } from '@angular/router';
+import { Location } from '../_models/location';
+
+
 
 @Component({
@@ -41,12 +41,14 @@
   cityOption: boolean = false;
   regionOption: boolean = false;
-  value:number;
+  value: number;
   max: number;
   toggle = true;
   status = 'Enable';
+  proba: any[];
 
-  constructor(private cityService : CityService, private regionService: RegionService,
-              private companionService : CompanionService, private categoryService : CategoryService,
-              private locationService: LocationService, private router : Router){
+
+  constructor(private cityService: CityService, private regionService: RegionService,
+    private companionService: CompanionService, private categoryService: CategoryService,
+    private locationService: LocationService, private router: Router, private fb: FormBuilder, private route: ActivatedRoute) {
     this.filteredOptions = new Observable<City[]>();
     this.cities = [];
@@ -63,14 +65,16 @@
     this.value = 0;
     this.max = 30;
+    this.proba = [];
   }
+
+  ngOnInit(): void {
   
-  ngOnInit() :void {
     this.filteredOptions = this.myControl.valueChanges
-    .pipe(
-      startWith(''),
-      switchMap(val => {
-        return this.filter(val || '')
-      })       
-    );
+      .pipe(
+        startWith(''),
+        switchMap(val => {
+          return this.filter(val || '')
+        })
+      );
 
     this.cityService.getAllCities().subscribe(
@@ -96,7 +100,8 @@
         this.companions = data;
       }
-    )
+    );
+
   }
-  
+
   filter(val: string): Observable<City[]> {
     // call the service which makes the http-request
@@ -107,22 +112,22 @@
         }))
       )
-
   }
 
- toggleSelection(chip: MatChip, category: Category){
-  chip.toggleSelected();
-  
-   if (this.chipsSeletion.length > 0) {
-     if (this.chipsSeletion.indexOf(category.id) <= -1) {
-       this.chipsSeletion.push(category.id);
-     } else {
-       const index = this.chipsSeletion.indexOf(category.id);
-       this.chipsSeletion.splice(index, 1);
-     }
-   } else {
-     this.chipsSeletion.push(category.id);
-   }
-   console.log(this.chipsSeletion);
- }
+  toggleSelection(chip: MatChip, category: Category) {
+    chip.toggleSelected();
+
+    if (this.chipsSeletion.length > 0) {
+      if (this.chipsSeletion.indexOf(category.id) <= -1) {
+        this.chipsSeletion.push(category.id);
+      } else {
+        const index = this.chipsSeletion.indexOf(category.id);
+        this.chipsSeletion.splice(index, 1);
+      }
+    } else {
+      this.chipsSeletion.push(category.id);
+    }
+    console.log(this.chipsSeletion);
+  }
+
 
 
@@ -135,18 +140,17 @@
         result => {
           console.log(result);
-          this.router.navigate(['locations']);
+          this.proba = result;
+          this.router.navigate(['locations'], {queryParams: {cityId: this.cityId, companionId: this.companionId, lengthOfStay: this.lengthOfStay, categoryIds: this.categoryIds}});
         }
       );
-    } else if (this.regionOption) {
-      this.locationService.getLocationsFromRegion(this.regionId, this.companionId, this.lengthOfStay, this.categoryIds).subscribe(
-        result => {
-          console.log(result);
-          this.router.navigate(['locations']);
-        }
-      );
-    }
-
-
-
+    } else
+      if (this.regionOption) {
+        this.locationService.getLocationsFromRegion(this.regionId, this.companionId, this.lengthOfStay, this.categoryIds).subscribe(
+          result => {
+            console.log(result);
+            this.router.navigate(['locations'], {queryParams: {regionId: this.regionId, companionId: this.companionId, lengthOfStay: this.lengthOfStay, categoryIds: this.categoryIds}});
+          }
+        );
+      }
   }
 
@@ -166,3 +170,4 @@
   }
 
+
 }
Index: trip-planner-front/src/app/planner/edit-planner/edit-planner.component.html
===================================================================
--- trip-planner-front/src/app/planner/edit-planner/edit-planner.component.html	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/planner/edit-planner/edit-planner.component.html	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -28,5 +28,10 @@
                             <td> <button mat-raised-button color="primary" (click)="onClickAddLocation()">
                                  Add locations
-                              </button>
+                                 </button>
+                            </td>
+                        </tr>
+                        <tr *ngFor ="let location of locations">
+                            <td>
+                                {{location.name}}
                             </td>
                         </tr>
Index: trip-planner-front/src/app/planner/edit-planner/edit-planner.component.ts
===================================================================
--- trip-planner-front/src/app/planner/edit-planner/edit-planner.component.ts	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/planner/edit-planner/edit-planner.component.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -3,5 +3,7 @@
 import { ActivatedRoute, Router } from '@angular/router';
 import { PlannerDto } from 'src/app/_models/dto/plannerDto';
+import { Location } from 'src/app/_models/location';
 import { Planner } from 'src/app/_models/planner';
+import { LocationService } from 'src/app/_services/location.service';
 import { PlannerService } from 'src/app/_services/planner.service';
 
@@ -18,14 +20,17 @@
   plannerDto: PlannerDto;
   id: number;
+  locations: Location[];
 
 
-  constructor(private router: Router, private route: ActivatedRoute ,private fb: FormBuilder, private plannerService: PlannerService) { 
+  constructor(private router: Router, private route: ActivatedRoute, private fb: FormBuilder, private plannerService: PlannerService,
+    private locationService : LocationService) {
     this.planner = new Planner();
     this.planners = [];
     this.form = fb.group({
       title: fb.control('initial value', Validators.required)
-  });
+    });
     this.plannerDto = new PlannerDto();
     this.id = 1;
+    this.locations = [];
   }
 
@@ -34,22 +39,26 @@
 
     this.form = this.fb.group({
-        name: [''],
-        description: [''],
-        locationList: []
+      name: [''],
+      description: [''],
+      locationList: []
     });
 
     this.plannerService.getPlannerById(this.id)
-    .pipe()
-    .subscribe(x => this.form.patchValue(x));
+      .pipe()
+      .subscribe(x => this.form.patchValue(x));
+
+    this.locationService.getLocationsFroPlanner(this.id).subscribe(
+      data => {
+          this.locations = data;
+      }
+    );
+    }
+ 
+  onSubmit() {
+    this.updatePlanner();
+
   }
 
-
-  onSubmit(){
-    this.updatePlanner();
-      
-  }
-
-  onClickAddLocation()
-  {
+  onClickAddLocation() {
     this.router.navigate(['form']);
   }
@@ -57,14 +66,14 @@
   private updatePlanner() {
     this.plannerService.updatePlanner(this.id, this.form.value)
-        .pipe()
-        .subscribe({
-            next: () => {
-              this.router.navigate(['planners']);
-            },
-            error: error => {
-                console.log("error");
-            }
-        });
+      .pipe()
+      .subscribe({
+        next: () => {
+          this.router.navigate(['planners']);
+        },
+        error: error => {
+          console.log("error");
+        }
+      });
+  }
+
 }
-  
-}
Index: trip-planner-front/src/app/planner/planner.component.ts
===================================================================
--- trip-planner-front/src/app/planner/planner.component.ts	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/src/app/planner/planner.component.ts	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -22,5 +22,5 @@
 
 
-  constructor(private plannerService: PlannerService, public dialog: MatDialog, private router: Router,
+  constructor(private plannerService: PlannerService, private dialog: MatDialog, private router: Router,
     private fb : FormBuilder) { 
     this.planners = [];
@@ -49,7 +49,6 @@
     console.log(id);
         this.plannerService.getPlannerById(id).subscribe(
-            data => {
-              
-              this.router.navigate(['edit/planner/', id])
+            data => {          
+              this.router.navigate(['edit/planner/', id]);
             }
      );
Index: trip-planner-front/tsconfig.json
===================================================================
--- trip-planner-front/tsconfig.json	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner-front/tsconfig.json	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -20,5 +20,6 @@
       "es2018",
       "dom"
-    ]
+    ],
+    "noImplicitAny": false
   },
   "angularCompilerOptions": {
Index: trip-planner/src/main/java/finki/diplomska/tripplanner/models/dto/PlannerDto.java
===================================================================
--- trip-planner/src/main/java/finki/diplomska/tripplanner/models/dto/PlannerDto.java	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner/src/main/java/finki/diplomska/tripplanner/models/dto/PlannerDto.java	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -10,10 +10,8 @@
     private String name;
     private String description;
-    private List<Long> locationList;
 
-    public PlannerDto(String name, String description, List<Long> locationList) {
+    public PlannerDto(String name, String description) {
         this.name = name;
         this.description = description;
-        this.locationList = locationList;
     }
 }
Index: trip-planner/src/main/java/finki/diplomska/tripplanner/models/dto/PlannerLocationDto.java
===================================================================
--- trip-planner/src/main/java/finki/diplomska/tripplanner/models/dto/PlannerLocationDto.java	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
+++ trip-planner/src/main/java/finki/diplomska/tripplanner/models/dto/PlannerLocationDto.java	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -0,0 +1,17 @@
+package finki.diplomska.tripplanner.models.dto;
+
+import lombok.Data;
+
+@Data
+public class PlannerLocationDto {
+    private Long locationId;
+    private Long plannerId;
+
+    public PlannerLocationDto() {
+    }
+
+    public PlannerLocationDto(Long locationId, Long plannerId) {
+        this.locationId = locationId;
+        this.plannerId = plannerId;
+    }
+}
Index: trip-planner/src/main/java/finki/diplomska/tripplanner/repository/jpa/JpaLocationRepository.java
===================================================================
--- trip-planner/src/main/java/finki/diplomska/tripplanner/repository/jpa/JpaLocationRepository.java	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner/src/main/java/finki/diplomska/tripplanner/repository/jpa/JpaLocationRepository.java	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -77,3 +77,9 @@
             "GROUP BY location.id_location ORDER BY CASE location.priority WHEN 'high' THEN 1 WHEN 'medium' THEN 2 WHEN 'low' THEN 3 END", nativeQuery = true)
     List<Location> findLocationsFromRegionForm(@Param("regionId") Long regionId, @Param("companionId") Long companionId, @Param("categoryIds") List<Long> categoryIds);
+
+    @Query(value = "SELECT * " +
+            "FROM locations AS l " +
+            "WHERE l.id_location IN " +
+            "(SELECT pl.id_location FROM planners_contain AS pl WHERE pl.id_planner = :plannerId)", nativeQuery = true)
+    List<Location> getAllLocationsForPlanner(@Param("plannerId") Long plannerId);
 }
Index: trip-planner/src/main/java/finki/diplomska/tripplanner/service/LocationService.java
===================================================================
--- trip-planner/src/main/java/finki/diplomska/tripplanner/service/LocationService.java	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner/src/main/java/finki/diplomska/tripplanner/service/LocationService.java	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -3,4 +3,6 @@
 
 import finki.diplomska.tripplanner.models.Location;
+import finki.diplomska.tripplanner.models.Planner;
+import finki.diplomska.tripplanner.models.dto.PlannerLocationDto;
 
 import java.util.List;
@@ -17,3 +19,6 @@
     List<Location> findLocationsFromCityForm(Long cityId, Long companionId, Long lengthOfStay, String categoryIds);
     List<Location> findLocationsFromRegionForm(Long regionId, Long companionId, Long lengthOfStay, String categoryIds);
+    Location addLocationToPlanner(PlannerLocationDto plannerLocationDto);
+    List<Location> getAllLocationsForPlanner(Long plannerId);
+
 }
Index: trip-planner/src/main/java/finki/diplomska/tripplanner/service/PlannerService.java
===================================================================
--- trip-planner/src/main/java/finki/diplomska/tripplanner/service/PlannerService.java	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner/src/main/java/finki/diplomska/tripplanner/service/PlannerService.java	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -14,5 +14,4 @@
         List<Planner> getAllPlaners();
         Optional<Planner> findById(Long id);
-        Planner addLocationToPlanner(Long plannerId, Long locationId);
         Planner editPlannerWithRequestParams(Long id, String description, String name, List<Location> locationList);
         Optional<Planner> newPlanner(PlannerDto plannerDto);
Index: trip-planner/src/main/java/finki/diplomska/tripplanner/service/impl/LocationServiceImpl.java
===================================================================
--- trip-planner/src/main/java/finki/diplomska/tripplanner/service/impl/LocationServiceImpl.java	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner/src/main/java/finki/diplomska/tripplanner/service/impl/LocationServiceImpl.java	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -2,6 +2,9 @@
 
 import finki.diplomska.tripplanner.models.Location;
+import finki.diplomska.tripplanner.models.Planner;
+import finki.diplomska.tripplanner.models.dto.PlannerLocationDto;
 import finki.diplomska.tripplanner.models.exceptions.LocationNotFoundException;
 import finki.diplomska.tripplanner.repository.jpa.JpaLocationRepository;
+import finki.diplomska.tripplanner.repository.jpa.JpaPlannerRepository;
 import finki.diplomska.tripplanner.service.LocationService;
 import org.springframework.stereotype.Service;
@@ -15,7 +18,9 @@
 
     private final JpaLocationRepository locationRepository;
+    private final JpaPlannerRepository plannerRepository;
 
-    public LocationServiceImpl(JpaLocationRepository locationRepository) {
+    public LocationServiceImpl(JpaLocationRepository locationRepository, JpaPlannerRepository plannerRepository) {
         this.locationRepository = locationRepository;
+        this.plannerRepository = plannerRepository;
     }
 
@@ -150,3 +155,18 @@
     }
 
+    @Override
+    public Location addLocationToPlanner(PlannerLocationDto plannerLocationDto) {
+        Location location = this.locationRepository.findById(plannerLocationDto.getLocationId())
+                .orElseThrow(() -> new LocationNotFoundException(plannerLocationDto.getLocationId()));
+        Planner planner = this.plannerRepository.getById(plannerLocationDto.getPlannerId());
+        planner.getLocationList().add(location);
+        return this.locationRepository.save(location);
+    }
+
+    @Override
+    public List<Location> getAllLocationsForPlanner(Long plannerId) {
+        return this.locationRepository.getAllLocationsForPlanner(plannerId);
+    }
+
+
 }
Index: trip-planner/src/main/java/finki/diplomska/tripplanner/service/impl/PlannerServiceImpl.java
===================================================================
--- trip-planner/src/main/java/finki/diplomska/tripplanner/service/impl/PlannerServiceImpl.java	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner/src/main/java/finki/diplomska/tripplanner/service/impl/PlannerServiceImpl.java	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -22,10 +22,8 @@
     private final JpaPlannerRepository plannerRepository;
     private final JpaLocationRepository locationRepository;
-    private final LocationService locationService;
 
-    public PlannerServiceImpl(JpaPlannerRepository plannerRepository, JpaLocationRepository locationRepository, LocationService locationService) {
+    public PlannerServiceImpl(JpaPlannerRepository plannerRepository, JpaLocationRepository locationRepository) {
         this.plannerRepository = plannerRepository;
         this.locationRepository = locationRepository;
-        this.locationService = locationService;
     }
 
@@ -40,12 +38,4 @@
     }
 
-    @Override
-    public Planner addLocationToPlanner(Long plannerId, Long locationId) {
-        Location location = this.locationService.findById(locationId)
-                .orElseThrow(() -> new LocationNotFoundException(locationId));
-        Planner planner = this.plannerRepository.getById(plannerId);
-        planner.getLocationList().add(location);
-        return this.plannerRepository.save(planner);
-    }
 
     @Override
@@ -84,5 +74,5 @@
         planner.setName(plannerDto.getName());
         planner.setDescription(plannerDto.getDescription());
-
+/*
         List<Location> locationList  = new ArrayList<>();
         for(Long location : plannerDto.getLocationList()){
@@ -92,4 +82,6 @@
         }
         planner.setLocationList(locationList);
+
+ */
         return Optional.of(this.plannerRepository.save(planner));
     }
Index: trip-planner/src/main/java/finki/diplomska/tripplanner/web/rest/LocationRestController.java
===================================================================
--- trip-planner/src/main/java/finki/diplomska/tripplanner/web/rest/LocationRestController.java	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner/src/main/java/finki/diplomska/tripplanner/web/rest/LocationRestController.java	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -2,4 +2,5 @@
 
 import finki.diplomska.tripplanner.models.Location;
+import finki.diplomska.tripplanner.models.dto.PlannerLocationDto;
 import finki.diplomska.tripplanner.service.LocationService;
 import finki.diplomska.tripplanner.service.PlannerService;
@@ -50,3 +51,13 @@
         return this.locationService.findLocationsFromRegionForm(regionId, companionId,lengthOfStay, categoryIds);
     }
+
+    @PutMapping(value = "/add-location")
+    public Location addLocationToPlanner(@RequestBody PlannerLocationDto plannerLocationDto){
+        return this.locationService.addLocationToPlanner(plannerLocationDto);
+    }
+
+    @GetMapping(value = "/planner/locations")
+    public List<Location> getAllLocationsForPlanner (@RequestParam Long plannerId){
+        return this.locationService.getAllLocationsForPlanner(plannerId);
+    }
 }
Index: trip-planner/src/main/java/finki/diplomska/tripplanner/web/rest/PlannerRestController.java
===================================================================
--- trip-planner/src/main/java/finki/diplomska/tripplanner/web/rest/PlannerRestController.java	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner/src/main/java/finki/diplomska/tripplanner/web/rest/PlannerRestController.java	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -71,7 +71,4 @@
     }
 
-    @PutMapping(value = "/add-location")
-    public Planner addLocationToPlanner(@RequestParam Long lid, @RequestParam Long pid){
-        return this.plannerService.addLocationToPlanner(lid, pid);
-    }
+
 }
Index: trip-planner/src/test/api.http
===================================================================
--- trip-planner/src/test/api.http	(revision 6c1585fa4f148668e18010744f1c91faa3165d6b)
+++ trip-planner/src/test/api.http	(revision ceaed429447854991cde276cd74df8d5dc9a2009)
@@ -52,5 +52,10 @@
 ###
 PUT http://localhost:8080/api/add-location
+Content-Type: application/json
+
+{"plannerId": 1, "locationId": 2}
+
+###
+GET http://localhost:8080/api/planner/locations?plannerId=1
 Content-Type: application/x-www-form-urlencoded
 
-lid=1&pid=1