diff --git a/doc/datatable/LazyLoadDoc.vue b/doc/datatable/LazyLoadDoc.vue
index f2eaa0b1c..990b0905a 100644
--- a/doc/datatable/LazyLoadDoc.vue
+++ b/doc/datatable/LazyLoadDoc.vue
@@ -18,6 +18,7 @@
             :value="customers"
             lazy
             paginator
+            :first="0"
             :rows="10"
             dataKey="id"
             :totalRecords="totalRecords"
@@ -96,7 +97,7 @@ export default {
                 { field: 'representative.name', header: 'Representative' }
             ],
             code: {
-                basic: `<DataTable :value="customers" lazy paginator :rows="10" v-model:filters="filters" ref="dt" dataKey="id"
+                basic: `<DataTable :value="customers" lazy paginator :first="0" :rows="10" v-model:filters="filters" ref="dt" dataKey="id"
         :totalRecords="totalRecords" :loading="loading" @page="onPage($event)" @sort="onSort($event)" @filter="onFilter($event)" filterDisplay="row"
         :globalFilterFields="['name','country.name', 'company', 'representative.name']"
         v-model:selection="selectedCustomers" :selectAll="selectAll" @select-all-change="onSelectAllChange" @row-select="onRowSelect" @row-unselect="onRowUnselect" tableStyle="min-width: 75rem">
@@ -124,7 +125,7 @@ export default {
 </DataTable>`,
                 options: `<template>
 	<div class="card p-fluid">
-        <DataTable :value="customers" lazy paginator :rows="10" v-model:filters="filters" ref="dt" dataKey="id"
+        <DataTable :value="customers" lazy paginator :first="0" :rows="10" v-model:filters="filters" ref="dt" dataKey="id"
                 :totalRecords="totalRecords" :loading="loading" @page="onPage($event)" @sort="onSort($event)" @filter="onFilter($event)" filterDisplay="row"
                 :globalFilterFields="['name','country.name', 'company', 'representative.name']"
                 v-model:selection="selectedCustomers" :selectAll="selectAll" @select-all-change="onSelectAllChange" @row-select="onRowSelect" @row-unselect="onRowUnselect" tableStyle="min-width: 75rem">
@@ -183,7 +184,7 @@ export default {
         this.loading = true;
 
         this.lazyParams = {
-            first: 0,
+            first: this.$refs.dt.first,
             rows: this.$refs.dt.rows,
             sortField: null,
             sortOrder: null,
@@ -242,7 +243,7 @@ export default {
 `,
                 composition: `<template>
 	<div class="card p-fluid">
-        <DataTable :value="customers" lazy paginator :rows="10" v-model:filters="filters" ref="dt" dataKey="id"
+        <DataTable :value="customers" lazy paginator :first="0" :rows="10" v-model:filters="filters" ref="dt" dataKey="id"
             :totalRecords="totalRecords" :loading="loading" @page="onPage($event)" @sort="onSort($event)" @filter="onFilter($event)" filterDisplay="row"
             :globalFilterFields="['name','country.name', 'company', 'representative.name']"
             v-model:selection="selectedCustomers" :selectAll="selectAll" @select-all-change="onSelectAllChange" @row-select="onRowSelect" @row-unselect="onRowUnselect" tableStyle="min-width: 75rem">
@@ -279,7 +280,7 @@ onMounted(() => {
     loading.value = true;
 
     lazyParams.value = {
-        first: 0,
+        first: dt.value.first,
         rows: dt.value.rows,
         sortField: null,
         sortOrder: null,
@@ -382,7 +383,7 @@ const onRowUnselect = () => {
         this.loading = true;
 
         this.lazyParams = {
-            first: 0,
+            first: this.$refs.dt.first,
             rows: this.$refs.dt.rows,
             sortField: null,
             sortOrder: null,