2 files changed, 37 insertions, 5 deletions
diff --git a/frontend/src/app/_elements/column-table/column-table.component.html b/frontend/src/app/_elements/column-table/column-table.component.html
index 9aebf114..3256ffee 100644
--- a/frontend/src/app/_elements/column-table/column-table.component.html
+++ b/frontend/src/app/_elements/column-table/column-table.component.html
@@ -44,6 +44,12 @@
                         </tr>
                     </tbody>
                 </table>
+                <div class="mb-3">
+                    <button mat-button  (click)="goBack()"><mat-icon>keyboard_arrow_left</mat-icon></button>
+                    <div style="display: inline;">{{(this.begin/10)+1}}</div>
+                    <button mat-button (click)="goForward()"><mat-icon>keyboard_arrow_right</mat-icon></button>
+                
+                </div>
             </div>
 
             <div [ngClass]="{'hidden': tabToDisplay != Table.CorrelationMatrix}">
diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts
index e9154cb3..b160ab30 100644
--- a/frontend/src/app/_elements/column-table/column-table.component.ts
+++ b/frontend/src/app/_elements/column-table/column-table.component.ts
@@ -42,9 +42,30 @@ export class ColumnTableComponent implements AfterViewInit {
   loaded: boolean = false;
 
 
+  begin:number=0;
+  end:number=10;
+
+
+
   constructor(private datasetService: DatasetsService, private experimentService: ExperimentsService, public csvParseService: CsvParseService, public dialog: MatDialog) {
     //ovo mi nece trebati jer primam dataset iz druge komponente
   }
+  resetPagging(){
+    this.begin=0;
+  }
+  goBack(){
+    if(this.begin-10<=0)
+      this.begin=0;
+    else
+      this.begin-=10;
+    this.loadData();
+
+  }
+  goForward(){
+    this.begin+=10;
+    this.loadData();
+  }
+
 
   updateCharts() {
     //min: number, max: number, q1: number, q3: number, median: number
@@ -90,16 +111,21 @@ export class ColumnTableComponent implements AfterViewInit {
     this.dataset.columnInfo.forEach(colInfo => {
       this.nullValOption.push(`Obriši redove (${colInfo.numNulls})`);
     });
+    this.resetPagging();
+    this.loadData();
+    this.loaded = true;
+
+    this.updateCharts();
+    this.updatePieChart();
+  }
 
-    this.datasetService.getDatasetFilePartial(this.dataset.fileId, 0, 10).subscribe((response: string | undefined) => {
+  loadData(){
+    if(this.dataset!=undefined)
+    this.datasetService.getDatasetFilePartial(this.dataset.fileId, this.begin, this.end).subscribe((response: string | undefined) => {
       if (response && this.dataset != undefined) {
         this.tableData = this.csvParseService.csvToArray(response, (this.dataset.delimiter == "razmak") ? " " : (this.dataset.delimiter == "novi red") ? "\t" : this.dataset.delimiter);
       }
     });
-    this.loaded = true;
-
-    this.updateCharts();
-    this.updatePieChart();
   }
 
   ngAfterViewInit(): void {