From a9c05943e0b5fde6cbfaad8eea8da3a0069c68b9 Mon Sep 17 00:00:00 2001
From: annabakouli <annabakouli@gmail.com>
Date: Wed, 6 Dec 2017 18:45:54 +0200
Subject: [PATCH] no message

---
 .../commons/datafield/CheckBoxData.java       |  2 +-
 dmp-frontend/src/app/app.module.ts            |  4 ++--
 .../dynamic-form-composite-field.html         |  2 +-
 .../dynamic-form-composite-field.ts           |  3 ++-
 .../dynamic-form-group.component.html         |  2 +-
 .../dynamic-form-group.component.ts           |  3 ++-
 .../dynamic-form-section.html                 |  2 +-
 .../dynamic-form-section.ts                   |  3 ++-
 .../src/app/form/dynamic-form.component.html  |  4 ++--
 .../src/app/form/dynamic-form.component.ts    | 11 ++++++----
 .../app/form/pagination/pagination-service.ts | 18 ++++++++++++++++
 .../base-table-of-content.component.ts        | 21 ++++++++++++-------
 .../table-of-content-field.component.html     |  2 +-
 .../table-of-content-field.component.ts       |  7 ++++---
 .../table-of-content-fieldset.component.html  |  2 +-
 .../table-of-content-fieldset.component.ts    |  7 ++++---
 .../table-of-content-group.component.html     |  4 ++--
 .../table-of-content-group.component.ts       |  7 ++++---
 .../table-of-content-section.component.html   |  6 +++---
 .../table-of-content-section.component.ts     |  7 ++++---
 .../table-of-contents.component.html          |  2 +-
 .../visibility-rules.service.ts               |  7 ++++++-
 22 files changed, 82 insertions(+), 44 deletions(-)
 create mode 100644 dmp-frontend/src/app/form/pagination/pagination-service.ts

diff --git a/dmp-backend/src/main/java/models/components/commons/datafield/CheckBoxData.java b/dmp-backend/src/main/java/models/components/commons/datafield/CheckBoxData.java
index d6719874d..8f37abb4d 100644
--- a/dmp-backend/src/main/java/models/components/commons/datafield/CheckBoxData.java
+++ b/dmp-backend/src/main/java/models/components/commons/datafield/CheckBoxData.java
@@ -28,7 +28,7 @@ public class CheckBoxData extends FieldData<CheckBoxData>{
 
 	@Override
 	public CheckBoxData fromXml(Element item) {
-		this.label = item.getAttribute("label");
+		this.label = item!=null?item.getAttribute("label"):""; //TODO
 		return this;
 	}
 
diff --git a/dmp-frontend/src/app/app.module.ts b/dmp-frontend/src/app/app.module.ts
index 3f30b1be2..8baafd160 100644
--- a/dmp-frontend/src/app/app.module.ts
+++ b/dmp-frontend/src/app/app.module.ts
@@ -1,3 +1,4 @@
+import { PaginationService } from './form/pagination/pagination-service';
 import {
     TableOfContentsFieldComponent,
 } from './form/tableOfContents/table-of-content-field/table-of-content-field.component';
@@ -51,7 +52,6 @@ import { HomepageComponent } from './homepage/homepage.component';
 import { ConfirmationComponent } from './widgets/confirmation/confirmation.component';
 
 
-import { PaginationService } from './services/pagination.service';
 import { EestoreService } from './services/eestore.service';
 import { GlobalInterceptor } from './services/interceptor';
 import { PDFService } from './services/transformers/pdf.service';
@@ -164,7 +164,7 @@ import {RadioButtonModule} from 'primeng/primeng';
     useClass: GlobalInterceptor,
     multi: true,
   },
-    ServerService, VisibilityRulesService, GlobalVariables, AuthGuard, PaginationService, TokenService, LocalStorageService, RestBase, EestoreService, NativeLoginService, PDFService
+    ServerService, VisibilityRulesService,PaginationService, GlobalVariables, AuthGuard, TokenService, LocalStorageService, RestBase, EestoreService, NativeLoginService, PDFService
   ],
   bootstrap: [AppComponent]
 })
diff --git a/dmp-frontend/src/app/form/dynamic-form-composite-field/dynamic-form-composite-field.html b/dmp-frontend/src/app/form/dynamic-form-composite-field/dynamic-form-composite-field.html
index aa4d741ba..b13e9ed85 100644
--- a/dmp-frontend/src/app/form/dynamic-form-composite-field/dynamic-form-composite-field.html
+++ b/dmp-frontend/src/app/form/dynamic-form-composite-field/dynamic-form-composite-field.html
@@ -1,4 +1,4 @@
-<div class="fieldset-component" [id]="compositeField.id" [formGroup]="form">
+<div *ngIf="visibilityRulesService.isElementVisible(pathName,compositeField.id)" class="fieldset-component" [id]="compositeField.id" [formGroup]="form">
     <h4 *ngIf="compositeField.title">{{compositeField.title}}</h4>
     <div class="content-left-margin">
         <h4 *ngIf="compositeField.description">{{compositeField.description}}</h4>
diff --git a/dmp-frontend/src/app/form/dynamic-form-composite-field/dynamic-form-composite-field.ts b/dmp-frontend/src/app/form/dynamic-form-composite-field/dynamic-form-composite-field.ts
index 89b759c2b..7e4c3885a 100644
--- a/dmp-frontend/src/app/form/dynamic-form-composite-field/dynamic-form-composite-field.ts
+++ b/dmp-frontend/src/app/form/dynamic-form-composite-field/dynamic-form-composite-field.ts
@@ -1,3 +1,4 @@
+import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service';
 import { CompositeField } from '../../models/CompositeField';
 import { FormGroup } from '@angular/forms';
 import { Section } from '../../entities/model/section';
@@ -17,7 +18,7 @@ import { Component, Input, OnInit, ViewEncapsulation } from '@angular/core';
     @Input() pathName:string;
     @Input() path:string;
     
-    constructor(){}
+    constructor(private visibilityRulesService:VisibilityRulesService){}
 
     ngOnInit(){
 
diff --git a/dmp-frontend/src/app/form/dynamic-form-group/dynamic-form-group.component.html b/dmp-frontend/src/app/form/dynamic-form-group/dynamic-form-group.component.html
index f7b39cc62..c8f4256f9 100644
--- a/dmp-frontend/src/app/form/dynamic-form-group/dynamic-form-group.component.html
+++ b/dmp-frontend/src/app/form/dynamic-form-group/dynamic-form-group.component.html
@@ -1,4 +1,4 @@
-<div class="group-component" [id]="group.id" [formGroup]="form">
+<div *ngIf="visibilityRulesService.isElementVisible(pathName,group.id)"  class="group-component" [id]="group.id" [formGroup]="form">
     <h4>{{path + ' ' + group.title}}</h4>
     <div class="content-left-margin">
         <h5 *ngIf="group.description">{{group.description}}</h5>
diff --git a/dmp-frontend/src/app/form/dynamic-form-group/dynamic-form-group.component.ts b/dmp-frontend/src/app/form/dynamic-form-group/dynamic-form-group.component.ts
index ae0765fe4..7c59a7047 100644
--- a/dmp-frontend/src/app/form/dynamic-form-group/dynamic-form-group.component.ts
+++ b/dmp-frontend/src/app/form/dynamic-form-group/dynamic-form-group.component.ts
@@ -1,3 +1,4 @@
+import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service';
 import { FieldGroup } from '../../models/FieldGroup';
 import { Component, Input, OnInit, ViewEncapsulation } from '@angular/core';
 import { FormGroup, Validators, FormControl } from '@angular/forms';
@@ -20,7 +21,7 @@ export class DynamicFormGroupComponent implements OnInit {
   @Input() path:string;
   
 
-  constructor() {
+  constructor(private visibilityRulesService:VisibilityRulesService) {
   }
 
   ngOnInit() {
diff --git a/dmp-frontend/src/app/form/dynamic-form-section/dynamic-form-section.html b/dmp-frontend/src/app/form/dynamic-form-section/dynamic-form-section.html
index c6bb68701..cc859b146 100644
--- a/dmp-frontend/src/app/form/dynamic-form-section/dynamic-form-section.html
+++ b/dmp-frontend/src/app/form/dynamic-form-section/dynamic-form-section.html
@@ -1,4 +1,4 @@
-<p-panel class="section-component" [toggleable]="true">
+<p-panel *ngIf="visibilityRulesService.isElementVisible(pathName,section.id)" class="section-component" [toggleable]="true">
     <p-header>
         <div class="ui-helper-clearfix">
             <h2>{{path}} {{section.title}}</h2>
diff --git a/dmp-frontend/src/app/form/dynamic-form-section/dynamic-form-section.ts b/dmp-frontend/src/app/form/dynamic-form-section/dynamic-form-section.ts
index ef0009717..1e96b0067 100644
--- a/dmp-frontend/src/app/form/dynamic-form-section/dynamic-form-section.ts
+++ b/dmp-frontend/src/app/form/dynamic-form-section/dynamic-form-section.ts
@@ -1,3 +1,4 @@
+import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service';
 import { FormGroup } from '@angular/forms';
 import { Section } from '../../entities/model/section';
 import { Component, Input, OnInit, ViewEncapsulation } from '@angular/core';
@@ -15,7 +16,7 @@ export class DynamicFormSectionComponent implements OnInit {
   @Input() form: FormGroup;
   @Input() pathName: string;
   @Input() path: string;
-  constructor() { }
+  constructor(private visibilityRulesService:VisibilityRulesService) { }
 
   ngOnInit() {
 
diff --git a/dmp-frontend/src/app/form/dynamic-form.component.html b/dmp-frontend/src/app/form/dynamic-form.component.html
index a18af6b7e..1cde376ed 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.html
+++ b/dmp-frontend/src/app/form/dynamic-form.component.html
@@ -9,14 +9,14 @@
 			<button type="button" class="btn btn-primary" (click)="submit();">Save and Finalize</button>
 			<progress-bar class="ui-g" *ngIf="progressbar" [formGroup]=form></progress-bar>
 			<div class="ui-g-12">
-				<p-steps [model]="stepperItems" [(activeIndex)]="activeStepperIndex" [readonly]="false"></p-steps>
+				<p-steps [model]="stepperItems" [activeIndex]="this.paginationService.getCurrentIndex()"  (activeIndex)="this.paginationService.setCurrentIndex($event)"[readonly]="false"></p-steps>
 			</div>
 			<div class="col-md-12 form-body-container" id="form-container">
 
 				<form *ngIf="form" novalidate [formGroup]="form" (ngSubmit)="onSubmit()">
 
 					<div *ngFor="let section of dataModel.sections; let i = index;">
-						<df-section [section]="section" [form]="form.get('sections').get(''+i)" [path]="i+1" [pathName]="'sections.'+i"></df-section>
+						<df-section *ngIf='this.paginationService.isElementVisible(section.page)' [section]="section" [form]="form.get('sections').get(''+i)" [path]="i+1" [pathName]="'sections.'+i"></df-section>
 					</div>
 				</form>
 			</div>
diff --git a/dmp-frontend/src/app/form/dynamic-form.component.ts b/dmp-frontend/src/app/form/dynamic-form.component.ts
index 818b918e0..71bb27980 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.ts
+++ b/dmp-frontend/src/app/form/dynamic-form.component.ts
@@ -1,3 +1,4 @@
+import { PaginationService } from './pagination/pagination-service';
 import { VisibilityRulesService } from '../visibility-rules/visibility-rules.service';
 import { TestModel } from '../testModel/testmodel';
 import { DatasetModel } from '../models/DatasetModel';
@@ -13,7 +14,6 @@ import 'rxjs/add/operator/switchMap';
 //import { FieldBase } from '../../app/form/fields/field-base';
 import { FieldControlService } from '../../app/services/field-control.service';
 import { ServerService } from '../../app/services/server.service';
-import { PaginationService } from '../../app/services/pagination.service';
 import { TokenService, TokenProvider } from '../services/login/token.service';
 import { ModalComponent } from '../modal/modal.component';
 
@@ -69,8 +69,11 @@ export class DynamicFormComponent implements OnInit {
   private progressbar: boolean = false;
 
   private fragment: string;
-  constructor(private qcs: FieldControlService, private serverService: ServerService, private router: Router, private pdfService: PDFService,
-    private _location: Location, private route: ActivatedRoute, private pagerService: PaginationService, private tokenService: TokenService, private visibilityRulesService: VisibilityRulesService) {
+  constructor(private serverService: ServerService, private router: Router, private pdfService: PDFService,
+    private _location: Location, private route: ActivatedRoute, private tokenService: TokenService
+    , private visibilityRulesService: VisibilityRulesService
+    , private paginationService:PaginationService
+  ) {
     this.datasetId = route.snapshot.params['id'];
   }
 
@@ -129,7 +132,7 @@ export class DynamicFormComponent implements OnInit {
       this.stepperItems.push({
         label: '',
         command: (event: any) => {
-          this.activeStepperIndex = item - 1;
+          this.paginationService.setCurrentIndex(event.index)          
         }
       })
     })
diff --git a/dmp-frontend/src/app/form/pagination/pagination-service.ts b/dmp-frontend/src/app/form/pagination/pagination-service.ts
new file mode 100644
index 000000000..181928ffe
--- /dev/null
+++ b/dmp-frontend/src/app/form/pagination/pagination-service.ts
@@ -0,0 +1,18 @@
+import { Injectable } from '@angular/core'
+@Injectable()
+export class PaginationService {
+
+    private currentPageIndex: number;
+
+    public setCurrentIndex(currentPageIndex: number): void {
+        this.currentPageIndex = currentPageIndex;
+    }
+
+    public getCurrentIndex():number{
+        return this.currentPageIndex;
+    }
+
+    public isElementVisible(elementPage: number):boolean {
+        return elementPage - 1  == this.currentPageIndex ; //TODO
+    }
+}
\ No newline at end of file
diff --git a/dmp-frontend/src/app/form/tableOfContents/base-table-of-content.component.ts b/dmp-frontend/src/app/form/tableOfContents/base-table-of-content.component.ts
index 2bace6c66..2022cacb7 100644
--- a/dmp-frontend/src/app/form/tableOfContents/base-table-of-content.component.ts
+++ b/dmp-frontend/src/app/form/tableOfContents/base-table-of-content.component.ts
@@ -1,13 +1,18 @@
-import { ActivatedRouteSnapshot,Router,ActivatedRoute } from '@angular/router';
+import { PaginationService } from '../pagination/pagination-service';
+import { ActivatedRouteSnapshot, Router, ActivatedRoute } from '@angular/router';
 
-export class BaseTableOfContent{
-    constructor(public router: Router,public route:ActivatedRoute){
+export class BaseTableOfContent {
+    constructor(public router: Router, public route: ActivatedRoute, public paginationService: PaginationService) {
         this.route.fragment.subscribe((fragment: string) => {
-            if(fragment)document.querySelector('#' + fragment).scrollIntoView();            
+            setTimeout(function() {
+                if (fragment) document.querySelector('#' + fragment).scrollIntoView();    
+            }, );
+            
         })
     }
-    
-    scrollToId(elementId) {
-      this.router.navigate([this.route.snapshot.url[0]+"/"+this.route.snapshot.url[1]], { fragment: elementId });    
-    }   
+
+    scrollToId(elementId, page: number) {
+        this.paginationService.setCurrentIndex(page-1);
+        this.router.navigate([this.route.snapshot.url[0] + "/" + this.route.snapshot.url[1]], { fragment: elementId });
+    }
 }
\ No newline at end of file
diff --git a/dmp-frontend/src/app/form/tableOfContents/table-of-content-field/table-of-content-field.component.html b/dmp-frontend/src/app/form/tableOfContents/table-of-content-field/table-of-content-field.component.html
index f443528b0..9f1f17ae9 100644
--- a/dmp-frontend/src/app/form/tableOfContents/table-of-content-field/table-of-content-field.component.html
+++ b/dmp-frontend/src/app/form/tableOfContents/table-of-content-field/table-of-content-field.component.html
@@ -1,2 +1,2 @@
-<a (click)="scrollToId(model.id)">{{path+' '+model.title}}</a>
+<a (click)="scrollToId(model.id,page)">{{path+' '+model.title}}</a>
     
\ No newline at end of file
diff --git a/dmp-frontend/src/app/form/tableOfContents/table-of-content-field/table-of-content-field.component.ts b/dmp-frontend/src/app/form/tableOfContents/table-of-content-field/table-of-content-field.component.ts
index 34e141ebf..958216811 100644
--- a/dmp-frontend/src/app/form/tableOfContents/table-of-content-field/table-of-content-field.component.ts
+++ b/dmp-frontend/src/app/form/tableOfContents/table-of-content-field/table-of-content-field.component.ts
@@ -1,3 +1,4 @@
+import { PaginationService } from '../../pagination/pagination-service';
 import { VisibilityRulesService } from '../../../visibility-rules/visibility-rules.service';
 import { BaseTableOfContent } from '../base-table-of-content.component';
 import { CompositeField } from '../../../models/CompositeField';
@@ -16,8 +17,8 @@ export class TableOfContentsFieldComponent extends BaseTableOfContent{
     @Input() model:Field;
     @Input() index:number;
     @Input() public path:string;
-
-    constructor(public router: Router, public route: ActivatedRoute,private visibilityRulesService: VisibilityRulesService) {
-        super(router, route)
+    @Input() public page: number;
+    constructor(public router: Router, public route: ActivatedRoute,private visibilityRulesService: VisibilityRulesService,public paginationService:PaginationService) {
+        super(router, route,paginationService)
       }
 }
\ No newline at end of file
diff --git a/dmp-frontend/src/app/form/tableOfContents/table-of-content-fieldset/table-of-content-fieldset.component.html b/dmp-frontend/src/app/form/tableOfContents/table-of-content-fieldset/table-of-content-fieldset.component.html
index f685911fc..0d638e32c 100644
--- a/dmp-frontend/src/app/form/tableOfContents/table-of-content-fieldset/table-of-content-fieldset.component.html
+++ b/dmp-frontend/src/app/form/tableOfContents/table-of-content-fieldset/table-of-content-fieldset.component.html
@@ -3,7 +3,7 @@
 <ul>
     <div *ngFor="let field of model.fields let i = index">
         <li *ngIf="visibilityRulesService.isElementVisible(null,field.id)">
-            <table-of-contents-field [model]="field" [index]="i" [path]="path">
+            <table-of-contents-field [page]='page' [model]="field" [index]="i" [path]="path">
             </table-of-contents-field>
         </li>
     </div>
diff --git a/dmp-frontend/src/app/form/tableOfContents/table-of-content-fieldset/table-of-content-fieldset.component.ts b/dmp-frontend/src/app/form/tableOfContents/table-of-content-fieldset/table-of-content-fieldset.component.ts
index c52977995..6d346a97f 100644
--- a/dmp-frontend/src/app/form/tableOfContents/table-of-content-fieldset/table-of-content-fieldset.component.ts
+++ b/dmp-frontend/src/app/form/tableOfContents/table-of-content-fieldset/table-of-content-fieldset.component.ts
@@ -1,3 +1,4 @@
+import { PaginationService } from '../../pagination/pagination-service';
 import { VisibilityRulesService } from '../../../visibility-rules/visibility-rules.service';
 import { BaseTableOfContent } from '../base-table-of-content.component';
 import { CompositeField } from '../../../models/CompositeField';
@@ -19,8 +20,8 @@ export class TableOfContentsFieldSetComponent extends BaseTableOfContent {
   @Input() model: CompositeField;
   @Input() index: number;
   @Input() public path: string;
-
-  constructor(public router: Router, public route: ActivatedRoute,private visibilityRulesService: VisibilityRulesService) {
-    super(router, route)
+  @Input() public page: number;
+  constructor(public router: Router, public route: ActivatedRoute,private visibilityRulesService: VisibilityRulesService,public paginationService:PaginationService) {
+    super(router, route,paginationService)
   }
 }
diff --git a/dmp-frontend/src/app/form/tableOfContents/table-of-content-group/table-of-content-group.component.html b/dmp-frontend/src/app/form/tableOfContents/table-of-content-group/table-of-content-group.component.html
index 9f9df4a09..08081cf53 100644
--- a/dmp-frontend/src/app/form/tableOfContents/table-of-content-group/table-of-content-group.component.html
+++ b/dmp-frontend/src/app/form/tableOfContents/table-of-content-group/table-of-content-group.component.html
@@ -1,5 +1,5 @@
-<a (click)="scrollToId(model.id)">{{path+' '+model.title}}</a>
+<a (click)="scrollToId(model.id,page)">{{path+' '+model.title}}</a>
     
     <div *ngFor="let fieldsetModel of model.compositeFields let i = index">
-        <table-of-contents-fieldset [model]="fieldsetModel" [index]="i" [path]="path+'.'+(i+1)"> </table-of-contents-fieldset>
+        <table-of-contents-fieldset [page]='page' [model]="fieldsetModel" [index]="i" [path]="path+'.'+(i+1)"> </table-of-contents-fieldset>
     </div>
diff --git a/dmp-frontend/src/app/form/tableOfContents/table-of-content-group/table-of-content-group.component.ts b/dmp-frontend/src/app/form/tableOfContents/table-of-content-group/table-of-content-group.component.ts
index 4431738a1..1090e5af3 100644
--- a/dmp-frontend/src/app/form/tableOfContents/table-of-content-group/table-of-content-group.component.ts
+++ b/dmp-frontend/src/app/form/tableOfContents/table-of-content-group/table-of-content-group.component.ts
@@ -1,3 +1,4 @@
+import { PaginationService } from '../../pagination/pagination-service';
 import { VisibilityRulesService } from '../../../visibility-rules/visibility-rules.service';
 import { BaseTableOfContent } from '../base-table-of-content.component';
 import { FieldGroup } from '../../../models/FieldGroup';
@@ -17,13 +18,13 @@ export class TableOfContentsGroupComponent extends BaseTableOfContent  {
   @Input() model: FieldGroup;
   @Input() index: number;
   @Input() public path: string;
-
+  @Input() public page: number;
   /*   @Output()
     setPage:EventEmitter<number> = new EventEmitter<number>();
 
  */
-  constructor(public router: Router, public route: ActivatedRoute,private visibilityRulesService: VisibilityRulesService) {
-    super(router, route)
+  constructor(public router: Router, public route: ActivatedRoute,private visibilityRulesService: VisibilityRulesService,public paginationService:PaginationService) {
+    super(router, route,paginationService)
   }
 
 
diff --git a/dmp-frontend/src/app/form/tableOfContents/table-of-content-section/table-of-content-section.component.html b/dmp-frontend/src/app/form/tableOfContents/table-of-content-section/table-of-content-section.component.html
index 41da8ffec..71747739b 100644
--- a/dmp-frontend/src/app/form/tableOfContents/table-of-content-section/table-of-content-section.component.html
+++ b/dmp-frontend/src/app/form/tableOfContents/table-of-content-section/table-of-content-section.component.html
@@ -1,14 +1,14 @@
 <!-- All contents in the first page -->
-<a (click)="scrollToId(model.id)">{{path+' '+model.title}}</a>
+<a (click)="scrollToId(model.id,page)">{{path+' '+model.title}}</a>
 
 <ul>
     <li *ngFor="let groupModel of model.fieldGroups let i = index">
-        <table-of-contents-group [model]="groupModel" [index]="i" [path]="path+'.'+(i+1)"> </table-of-contents-group>
+        <table-of-contents-group [page]='page' [model]="groupModel" [index]="i" [path]="path+'.'+(i+1)"> </table-of-contents-group>
     </li>
 </ul>
 <!-- All contents in the first page -->
 <ul>
     <li *ngFor="let sectionModel of model.sections let i = index">
-        <table-of-contents-section [model]="sectionModel" [index]="i" [path]="path+'.'+(i+1)"> </table-of-contents-section>
+        <table-of-contents-section [page]='page' [model]="sectionModel" [index]="i" [path]="path+'.'+(i+1)"> </table-of-contents-section>
     </li>
 </ul>
\ No newline at end of file
diff --git a/dmp-frontend/src/app/form/tableOfContents/table-of-content-section/table-of-content-section.component.ts b/dmp-frontend/src/app/form/tableOfContents/table-of-content-section/table-of-content-section.component.ts
index dda835ba0..b3463ac7c 100644
--- a/dmp-frontend/src/app/form/tableOfContents/table-of-content-section/table-of-content-section.component.ts
+++ b/dmp-frontend/src/app/form/tableOfContents/table-of-content-section/table-of-content-section.component.ts
@@ -1,3 +1,4 @@
+import { PaginationService } from '../../pagination/pagination-service';
 import { VisibilityRulesService } from '../../../visibility-rules/visibility-rules.service';
 import { BaseTableOfContent } from '../base-table-of-content.component';
 import { Section } from '../../../models/Section';
@@ -17,9 +18,9 @@ export class TableOfContentsSectionComponent extends BaseTableOfContent implemen
   @Input() model: Section;
   @Input() index: number;
   @Input() public path: string;
-
-  constructor(public router: Router,public route:ActivatedRoute,private visibilityRulesService: VisibilityRulesService){
-    super(router,route)
+  @Input() public page: number;
+  constructor(public router: Router,public route:ActivatedRoute,private visibilityRulesService: VisibilityRulesService,public paginationService:PaginationService){
+    super(router,route,paginationService)
   }
   ngOnInit() {
 
diff --git a/dmp-frontend/src/app/form/tableOfContents/table-of-contents.component.html b/dmp-frontend/src/app/form/tableOfContents/table-of-contents.component.html
index 468ce8f7a..78fa65451 100644
--- a/dmp-frontend/src/app/form/tableOfContents/table-of-contents.component.html
+++ b/dmp-frontend/src/app/form/tableOfContents/table-of-contents.component.html
@@ -2,6 +2,6 @@
 <ul>
     <li *ngFor="let section of model.sections let i = index">
         <!-- && field.label for sections without field label as data summery -->
-        <table-of-contents-section [model]="section" [index]="i+1" [path]="i+1"> </table-of-contents-section>
+        <table-of-contents-section [page]='section.page' [model]="section" [index]="i+1" [path]="i+1"> </table-of-contents-section>
     </li>
 </ul>
\ No newline at end of file
diff --git a/dmp-frontend/src/app/visibility-rules/visibility-rules.service.ts b/dmp-frontend/src/app/visibility-rules/visibility-rules.service.ts
index 048e29020..42318060d 100644
--- a/dmp-frontend/src/app/visibility-rules/visibility-rules.service.ts
+++ b/dmp-frontend/src/app/visibility-rules/visibility-rules.service.ts
@@ -14,7 +14,12 @@ export class VisibilityRulesService {
         if (!this.fieldsPathMemory[id] && pathKey) this.fieldsPathMemory[id] = pathKey;
         let visibilityRule = this.visibilityRuleContext.getRulesFromKey(id);
         if (!visibilityRule) return true;
-        return this.checkElementVisibility(visibilityRule);
+        if (this.checkElementVisibility(visibilityRule)) {
+            return true
+        } else {
+            if (pathKey) this.formGroup.get(pathKey + '.value').patchValue(null)
+            return false;
+        }
     }
 
     public checkElementVisibility(visibilityRule: VisibilityRule): boolean {