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 59329aad30ff25ec5095bb7ffb78ddb59b7dc111)
+++ trip-planner-front/src/app/location/add-location-to-planner-panel/add-location-to-planner-panel.component.html	(revision e29cc2ea91f8c99a4329f6d20188305dfd752279)
@@ -1,15 +1,20 @@
-<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 type="button"  mat-button (click)="onCancelClick()">Cancel</button>
+<p-table [value]="planners" [paginator]="true" [rows]="3" [responsive]="true">
+    <ng-template pTemplate="header">
+        <tr>
+            <th pSortableColumn="name">Name <p-sortIcon field="vin"></p-sortIcon>
+            </th>
+            <th style="width:4em"></th>
+        </tr>
+    </ng-template>
+    <ng-template pTemplate="body" let-planner>
+        <tr>
+            <td>{{planner.name}}</td>
+
+            <td>
+                <button pButton pRipple type="button" icon="pi pi-heart"
+                    class="p-button-rounded p-button-help p-button-text" (click)="selectPlanner(planner)"></button>
+            </td>
+        </tr>
+    </ng-template>
+</p-table>
+
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 59329aad30ff25ec5095bb7ffb78ddb59b7dc111)
+++ trip-planner-front/src/app/location/add-location-to-planner-panel/add-location-to-planner-panel.component.ts	(revision e29cc2ea91f8c99a4329f6d20188305dfd752279)
@@ -1,10 +1,10 @@
 import { Component, OnInit } from '@angular/core';
-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';
+import { DynamicDialogRef } from 'primeng/dynamicdialog';
+
+
+
 
 @Component({
@@ -16,56 +16,26 @@
 
   planners: Planner[];
-  location: Location;
-  plannerId: number;
-  locationId: number;
-  plannerLocationDto: PlannerLocationDto;
-  locationsInPlanner: Location[];
 
 
-  constructor(private dialogRef: MatDialogRef<AddLocationToPlannerPanelComponent>, private plannerService: PlannerService,
-    private locationService: LocationService, private route: ActivatedRoute) {
+
+  constructor(private plannerService: PlannerService,
+    private route: ActivatedRoute, private ref: DynamicDialogRef) {
     this.planners = [];
-    this.location = new Location;
-    this.plannerId = 1;
-    this.locationId = 1;
-    this.plannerLocationDto = new PlannerLocationDto();
-    this.locationsInPlanner = [];
   }
 
   ngOnInit(): void {
+
     this.plannerService.getAllPlanners().subscribe(
-      data => {
-        this.planners = data;
+      planner => {
+        this.planners = planner;
       }
     );
+  }
+
+  selectPlanner(planner: Planner) {
+    this.ref.close(planner);
+  }
 
 
-    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);
-      }
-    );
-    */
-
-   // window.location.reload();
-    }
 
 }
