fix for bug when using custom perPage dropdown with a custom perPage …

…property
xaksis · Aug 25, 2018 · 2c7ab02 · 2c7ab02
1 parent db397f4
commit 2c7ab02
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 9 deletions.
diff --git a/dev/App.vue b/dev/App.vue
@@ -17,7 +17,12 @@
       :fixed-header="true"
       max-height="300px"
       :line-numbers="true"
-      :pagination-options="{ mode: 'pages', enabled: true, perPage: 5}"
+      :pagination-options="{
+        mode: 'pages',
+        enabled: true,
+        perPage: 2,
+        perPageDropdown: [3, 5, 9],
+      }"
       :select-options="{
         enabled: false,
         selectOnCheckboxOnly: false,

diff --git a/src/components/VgtPagination.vue b/src/components/VgtPagination.vue
@@ -170,7 +170,8 @@ export default {
       if (event) {
         this.currentPerPage = parseInt(event.target.value, 10);
       }
-      if (this.currentPerPage === -1) {
+      if (this.currentPerPage === -1
+      || this.total < this.currentPerPage * this.currentPage) {
         // reset current page to 1
         this.currentPage = 1;
       }
@@ -182,7 +183,16 @@ export default {
     },
 
     handlePerPage() {
-      this.rowsPerPageOptions = cloneDeep(this.defaultRowsPerPageDropdown);
+      //* if there's a custom dropdown then we use that
+      if (this.customRowsPerPageDropdown !== null
+        && (Array.isArray(this.customRowsPerPageDropdown)
+        && this.customRowsPerPageDropdown.length !== 0)) {
+        this.rowsPerPageOptions = this.customRowsPerPageDropdown;
+      } else {
+        //* otherwise we use the default rows per page dropdown
+        this.rowsPerPageOptions = cloneDeep(this.defaultRowsPerPageDropdown);
+      }
+
       if (this.perPage) {
         this.currentPerPage = this.perPage;
         // if perPage doesn't already exist, we add it
@@ -197,12 +207,6 @@ export default {
         // reset to default
         this.currentPerPage = 10;
       }
-
-      if (this.customRowsPerPageDropdown !== null
-        && (Array.isArray(this.customRowsPerPageDropdown)
-        && this.customRowsPerPageDropdown.length !== 0)) {
-        this.rowsPerPageOptions = this.customRowsPerPageDropdown;
-      }
     },
   },