diff --git a/src/app/mapping/class/dataset.ts b/src/app/mapping/class/dataset.ts
index d4f2f6499b23d8608265d2e3ea7a7ce25e098516..080bc153abfdc97b2c8f36c2583454004aa9efb5 100644
--- a/src/app/mapping/class/dataset.ts
+++ b/src/app/mapping/class/dataset.ts
@@ -2,13 +2,19 @@ export class Dataset {
     public name: string;
     public identifier: string;
     public usageNote: string;
+
+    constructor(name: string, identifier: string, usageNote: string) {
+        this.name = name;
+        this.identifier = identifier;
+        this.usageNote = usageNote;
+    }
 }
 
 export class DatasetPath {
-    public dcatProperty: string;
+    public dcatProperty: Dataset | string;
     public path: string
 
-    constructor(dcatProperty: string, path: string) {
+    constructor(dcatProperty: Dataset, path: string) {
         this.dcatProperty = dcatProperty;
         this.path = path;
     }
diff --git a/src/app/mapping/mapping.component.html b/src/app/mapping/mapping.component.html
index 2a4359bbc27fbb7a443e31cb3a5a5fdff27b172a..6f7a83288c57bde3b53c9a5ea6fb70a7764b4e6c 100644
--- a/src/app/mapping/mapping.component.html
+++ b/src/app/mapping/mapping.component.html
@@ -13,11 +13,11 @@
                         <input type="file" id="file" (change)="importJson($event)" accept=".json" />
                     </div>
 
-                    <ng-container *ngFor="let dataset of datasetModel; let index = index;trackBy:trackByIndex;">
+                    <ng-container *ngFor="let dataset of obsDcatVocabulary | async; let index = index ;trackBy:trackByIndex ;">
                         <nb-form-field>
                             <div class="row">
 
-                                <div class="col-4">
+                                <div class="col-3" style="margin-right: 10px;">
 
                                     <nb-form-field>
                                         <input
@@ -34,14 +34,14 @@
                                     </nb-form-field>
 
                                 </div>
-                                <div class="col-8">
+                                <div class="col-7">
 
                                     <nb-form-field>
                                         <input
                                             *ngIf="dataset.identifier === 'dct:hasVersion' || dataset.identifier === 'dct:title' "
                                             required #autoInput #{{dataset.identifier}}="ngModel" fullWidth
                                             id="{{dataset.identifier}}" name="{{dataset.identifier}}" nbInput
-                                            (ngModelChange)="onModelChange($event)" placeholder="Enter value" [nbAutocomplete]="auto"
+                                            (ngModelChange)="onModelChange($event)"  [nbAutocomplete]="auto"
                                             [(ngModel)]="selectedPaths[index]" autocomplete="false" (focus)="reset()" />
                                         <div
                                             *ngIf="dataset.identifier.invalid && (dataset.identifier.dirty || dataset.identifier.touched)">
@@ -50,10 +50,9 @@
                                             *ngIf=" dataset.identifier !== 'dct:hasVersion' && dataset.identifier !== 'dct:title'"
                                             #autoInput #{{dataset.identifier}}="ngModel" fullWidth
                                             id="{{dataset.identifier}}" name="{{dataset.identifier}}" nbInput
-                                            (ngModelChange)="onModelChange($event)" placeholder="Enter value" [nbAutocomplete]="auto"
+                                            (ngModelChange)="onModelChange($event)"  [nbAutocomplete]="auto"
                                             [(ngModel)]="selectedPaths[index]" autocomplete="false" (focus)="reset()" />
-
-
+    
                                         <nb-autocomplete #auto>
 
                                             <nb-option *ngFor="let option of filteredOptions | async" [value]="option">
@@ -63,7 +62,16 @@
                                         </nb-autocomplete>
                                     </nb-form-field>
                                 </div>
-                                
+                                <div class="col-2" *ngIf="isMultiple(dataset)" style="margin-left: 10px;">
+                                    <button nbButton ghost (click)="addField(index)">
+                                        <nb-icon icon="plus-outline"  status="primary">
+                                        </nb-icon>
+                                    </button>
+                                    <button nbButton ghost *ngIf="dataset.identifier !== 'dct:hasVersion' && dataset.identifier !== 'dct:title'" (click)="deleteField(index)" >
+                                        <nb-icon icon="trash-2-outline" status="danger"  >
+                                        </nb-icon>
+                                    </button>
+                                </div>
                             </div>
                         </nb-form-field>
                     </ng-container>
@@ -89,7 +97,7 @@
 
                     <nb-list-item *ngFor="let data of mappedMetadatas[index] | keyvalue; trackBy:trackByIndex; ">
                         <div class="row">
-                            <div class="col-5"><label for="{{data.key}}">{{data.key}}</label></div>
+                            <div class="col-5"><label for="{{data.key}}">{{dcatVocabulary[data.key].identifier}}</label></div>
                             <div class="col-5"> <input nbInput [ngModel]="data.value"
                                     (ngModelChange)="mappedMetadatas[index].set(data.key, $event)" /> </div>
                             <div class="col-2"><button nbButton ghost>
diff --git a/src/app/mapping/mapping.component.scss b/src/app/mapping/mapping.component.scss
index 1227abfb2cd766e841e916aff1ec4e89d4e6fd38..68382b72937c99e6d9009eed3e99282479d2745e 100644
--- a/src/app/mapping/mapping.component.scss
+++ b/src/app/mapping/mapping.component.scss
@@ -4,12 +4,7 @@
     flex: 1 0 calc(100%);
     margin: 0 -0.5rem;
   }
-  .row {
-    display: flex;
-    flex: 1 0 calc(100%);
-    margin: 5px -0.5rem;
-    
-  }
+  
   
   .card-col {
     width: 100%;
@@ -22,10 +17,10 @@
     margin: 10px 10px;
     
   }
-
-  input-basic-disabled-text-color {
-    color: black;
+  input:disabled{
+    color: black
   }
+  
 
   .button-center{
     vertical-align: middle;
diff --git a/src/app/mapping/mapping.component.ts b/src/app/mapping/mapping.component.ts
index 0cc4c1ca3e4042aa15b945e0af4dbd68cfa33629..802334ddce296a929006f597f29a17414f39d702 100644
--- a/src/app/mapping/mapping.component.ts
+++ b/src/app/mapping/mapping.component.ts
@@ -24,19 +24,19 @@ import { FeedbackDialogComponent } from './dialog/feedback-dialog/feedback-dialo
 export class MappingComponent implements OnInit {
 
   itemsdataset: Object[] = []
-  datasetModel: Dataset[];
+  dcatVocabulary: Dataset[];
+  obsDcatVocabulary: Observable<Dataset[]>;
   filteredOptions: Observable<string[]>;
   keys: string[] = [];
   selectedPaths: string[];
-  mappedMetadatas: Map<string, string>[] = [];
-  obsMappedMetadatas: Observable<Map<string, string>[]>;
+  mappedMetadatas: Map<number, string>[] = [];
   DatasetToPublish: Map<string, string>[];
   index: number = 0
   first: boolean = true;
   loading: boolean = false;
   loadingCr = false;
   FDP_URL = environment.fdpUrl;
-
+  Object: Object;
   ids: number[];
   @ViewChild('autoInput') input;
   @Input() type: string;
@@ -47,22 +47,14 @@ export class MappingComponent implements OnInit {
   ngOnInit() {
     this.dataSetService.getLocally('./assets/dataset.json').subscribe(
       dataset => {
-        this.datasetModel = dataset;
-        this.selectedPaths = new Array(dataset.length);
+        this.dcatVocabulary = dataset;
+        this.obsDcatVocabulary = of(this.dcatVocabulary)
+        this.selectedPaths = [];
       },
       error => {
         console.error(error);
       },
     );
-    this.obsMappedMetadatas = of(this.mappedMetadatas)
-    this.populatecatalogue();
-    console.log("TYPE: " + this.type)
-  }
-
-
-
-
-  populatecatalogue() {
     this.itemsdataset = this.dataSetService.itemsDataset;
     this.ids = this.dataSetService.ids;
     this.ids
@@ -71,12 +63,14 @@ export class MappingComponent implements OnInit {
     this.filteredOptions = of(this.keys);
   }
 
-  createDataset(item: Object): Map<string, string> {
-    let mappedMetadata: Map<string, string> = new Map()
+
+  createDataset(item: Object): Map<number, string> {
+   console.log("rerereer" + this.selectedPaths)
+    let mappedMetadata: Map<number, string> = new Map()
     for (let i = 0; i < this.selectedPaths.length; i++) {
       if (this.selectedPaths[i]) {
         let tab = this.selectedPaths[i].split(' : ');
-        this.type == "Dataverse" ? mappedMetadata.set(this.datasetModel[i].identifier, this.getValueDataverse(tab, item)) : mappedMetadata.set(this.datasetModel[i].identifier, this.getValueCustom(tab, item));
+        this.type == "Dataverse" ? mappedMetadata.set(i, this.getValueDataverse(tab, item)) : mappedMetadata.set(i, this.getValueCustom(tab, item));
       }
     }
     this.loadingCr = false;
@@ -94,8 +88,9 @@ export class MappingComponent implements OnInit {
 
       let title = "";
       properties = "";
-      this.mappedMetadatas[i].forEach((value: string, key: string) => {
-        (value.length > 0) ? value = this.replaceAll(value, '\n', '') : value;
+      this.mappedMetadatas[i].forEach((value: string, index: number) => {
+        let key = this.dcatVocabulary[index].identifier;
+        (value && typeof value === "string")  ? value = this.replaceAll(value, '\n', '') : value;
         if (key === 'dct:title') { title = value };
         switch (key) {
           case 'dct:landingPage':
@@ -289,9 +284,6 @@ export class MappingComponent implements OnInit {
     }
   }
 
-  
-
-
   mapDataset() {
     this.loadingCr = true;
     this.mappedMetadatas = [];
@@ -320,11 +312,11 @@ export class MappingComponent implements OnInit {
 
   downloadJson() {
     let datasetPathArray: DatasetPath[] = [];
-    for (let i = 0; i < this.datasetModel.length; i++) {
+    for (let i = 0; i < this.dcatVocabulary.length; i++) {
       if (this.selectedPaths[i]) {
-        datasetPathArray.push(new DatasetPath(this.datasetModel[i].identifier, this.selectedPaths[i]));
+        datasetPathArray.push(new DatasetPath(this.dcatVocabulary[i], this.selectedPaths[i]));
       } else {
-        datasetPathArray.push(new DatasetPath(this.datasetModel[i].identifier, ""));
+        datasetPathArray.push(new DatasetPath(this.dcatVocabulary[i], ""));
       }
 
     }
@@ -346,20 +338,52 @@ export class MappingComponent implements OnInit {
     let reader = new FileReader();
     let datasetPath: DatasetPath[] = [];
     reader.onloadend = () => {
-
       datasetPath = <DatasetPath[]>JSON.parse(reader.result as string);
-      datasetPath.forEach(e => {
-        this.selectedPaths[datasetPath.indexOf(e)] = e.path;
-      })
+      for (let i = 0; i < datasetPath.length; i++) {
+        this.selectedPaths[i] = datasetPath[i].path;
+        if (typeof datasetPath[i].dcatProperty === 'string') {
+          this.dcatVocabulary[i] = new Dataset('',<string> datasetPath[i].dcatProperty, '');
+        } else {
+          this.dcatVocabulary[i] = <Dataset> datasetPath[i].dcatProperty;
+        }
+      }
     }
     reader.readAsText(jsonFile);
   }
 
   addField(index: number) {
-    
+    this.dcatVocabulary.splice(index + 1, 0, this.dcatVocabulary[index]); 
+    console.log('add');
+   }
+
+  deleteField(index: number) {
+    this.dcatVocabulary.splice(index, 1);
   }
+
+  isMultiple(dataset: Dataset): boolean {
+    let bool: boolean = true;
+    switch (dataset.identifier) {
+      case "dct:isPartOf":
+        bool = false;
+        break;
+      case "dcat:landingPage":
+        bool = false;
+        break;
+      case "dcat:contactPoint":
+        bool = false;
+        break;
+      case "foaf:homePage":
+        bool = false;
+        break;
+      default:
+        bool = true;
+        break;
+    }
+    return bool;
+  }
+
   // to delete a property of dcat dataset mapped
-  deleteProperty(key: string) {
+  deleteProperty(key: number) {
     this.mappedMetadatas[this.index].delete(key);
   }
 
diff --git a/src/styles.scss b/src/styles.scss
index 5efd1a01aadf7dec8161b1ce3efc1bc5b1558f29..1d822f21d2e6efa5528412a3252bfe3b3cf495bb 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -71,78 +71,77 @@ textarea {
   font-size: 1em;
   padding-left: .4em;
 }
+.row {
+  display: flex;
+  flex: 1 0 calc(100%);
+  margin: 5px -0.5rem;
+  
+}
 
 .col-1 {
   flex: 0 0 auto;
   width: 8.33333333%;
-  margin-right: 10px;
+  align-items: center;
+  
 }
 
 .col-2 {
   flex: 0 0 auto;
   width: 16.66666667%;
-  margin-right: 10px;
+  
 }
 
 .col-3 {
   flex: 0 0 auto;
   width: 25%;
-  margin-right: 10px;
-
+  
 }
 
 .col-4 {
   flex: 0 0 auto;
   width: 33.33333333%;
-  margin-right: 10px;
 }
 
 .col-5 {
   flex: 0 0 auto;
   width: 41.66666667%;
-  margin-right: 10px;
 }
 
 .col-6 {
   flex: 0 0 auto;
   width: 50%;
-  margin-right: 10px;
 }
 
 .col-7 {
   flex: 0 0 auto;
   width: 58.33333333%;
-  margin-right: 10px;
 }
 
 .col-8 {
   flex: 0 0 auto;
   width: 66.66666667%;
-  margin-right: 10px;
+  
+ 
 }
 
 .col-9 {
   flex: 0 0 auto;
   width: 75%;
-  margin-right: 10px;
 }
 
 .col-10 {
   flex: 0 0 auto;
   width: 83.33333333%;
-  margin-right: 10px;
 }
 
 .col-11 {
   flex: 0 0 auto;
   width: 91.66666667%;
-  margin-right: 10px;
 }
 
 .col-12 {
   flex: 0 0 auto;
   width: 100%;
-  margin-right: 10px;
 }