feature(EJ2-3474): typescript samples for pagesizes feature

Author: pipeline

src/common/sampleList.ts

@@ -6,26 +6,25 @@
 </div>
 
 <div id="description">
-    <p>Paging allows you to display the contents of the Grid in page segments. 
-        The number of items on a page is determined
-        by the <code><a target="_blank" class="code"
-        href="http://ej2.syncfusion.com/documentation/grid/api-pageSettingsModel.html#pagesize-number">
-        pageSettings->pageSize
-        </a></code> property. 
-        If no value is specified for the <code><a target="_blank" class="code"
-        href="http://ej2.syncfusion.com/documentation/grid/api-pageSettingsModel.html#pagesize-number">
-        pageSettings->pageSize
-        </a></code> property, 
-        the Grid will display 12 items on a page. By default, paging is disabled. 
+    <p>Paging allows you to display the contents of the Grid in page segments.
+        By default, paging is disabled.
         To enable paging, set <code><a target="_blank" class="code"
         href="http://ej2.syncfusion.com/documentation/grid/api-grid.html#allowpaging-boolean">allowPaging
-        </a></code> property to true.</p>
+        </a></code> property to true. <code><a target="_blank" class="code"
+        href="http://ej2.syncfusion.com/documentation/grid/api-pageSettingsModel.html#pagesizes-boolean---number">
+        pageSettings->pageSizes
+        </a></code> property enables a dropdown in pager which allows you to change the number of records in Grid dynamically.
+    </p>
     <p>
-        In this demo, the Grid is rendered with its default page settings, also the 
+        In this demo, the Grid is rendered with
+        <code><a target="_blank" class="code"
+        href="http://ej2.syncfusion.com/documentation/grid/api-pageSettingsModel.html#pagesizes-boolean---number">
+        pageSettings->pageSizes
+        </a></code>set to true and
         <code><a target="_blank" class="code"
         href="http://ej2.syncfusion.com/documentation/grid/api-pageSettingsModel.html#pagecount-number">
         pageSettings->pageCount
-        </a></code> is set to 5.
+        </a></code> is set to 4.
     </p>        
     <p style="font-weight: 500">Injecting Module</p>
     <p>

src/grid/defaultpaging-plnkr.json

@@ -19,7 +19,7 @@ this.default = (): void => {
                 { field: 'ShippedDate', headerText: 'Shipped Date', width: 140, format: 'yMd', textAlign: 'right' },
                 { field: 'ShipCountry', headerText: 'Ship Country', width: 150 }
             ],
-            pageSettings: { pageCount: 5 }
+            pageSettings: { pageCount: 4, pageSizes: true }
         });
     grid.appendTo('#Grid');
 };

src/grid/defaultpaging.html

@@ -28,7 +28,7 @@
     {"url":"sortingapi", "name": "Sorting API", "category":"Sorting"},
     {"url":"filter", "name": "Default Filtering", "category":"Filtering"},
     {"url":"search", "name": "Search", "category":"Filtering"},
-    {"url":"defaultpaging", "name": "Default Paging", "category": "Paging"},
+    {"url":"defaultpaging", "name": "Default Paging", "category": "Paging", "type": "update"},
     {"url":"pagingapi", "name": "Paging API", "category": "Paging"},
     {"url":"selection", "name": "Default Selection", "category":"Selection"},
     {"url":"selectionapi", "name": "Selection API", "category": "Selection"},