Table functions > The “Show 10 records” drop-down

Crud Elite

Getting Started

Action Column

Hide action column

Add buttons to action column

Table functions

Default sorting

“Show 10 records” drop-down

The “Search…” placeholder

Exported file

Columns ordering

Custom content in a column

Confirm delete popup

Common issues

Edit auratheme.table.js

Other

Clone for another table

How it works

Read data for the table

How to change the "Show 10 Records" page size options?

How to customize the "Show 10 Records" page size options? For example, if you'd like to change the default "10, 25, 50, All" options to something like "10, 20, 30, 40, 50, All," here's how you can do it.

The steps

Open _Table.cshtml, original code is:

@await Html.PartialAsync("_TableLengthAndSearch", new TableLengthViewModel { Options = TableHelper.DefaultPageSizeOptions, SearchPlaceholder = ClientTableConfig.SearchMessage })

You can change to:

@await Html.PartialAsync("_TableLengthAndSearch", new TableLengthViewModel
   {
       Options = new List<SelectListItem>
        {
	        new SelectListItem { Text = "Show 10 Records", Value = "10", Selected =  true  },
	        new SelectListItem { Text = "Show 20 Records", Value = "20", Selected =  false },
	        new SelectListItem { Text = "Show 30 Records", Value = "30", Selected =  false },
	        new SelectListItem { Text = "Show 40 Records", Value = "40", Selected =  false },
	        new SelectListItem { Text = "Show 50 Records", Value = "50", Selected = false },
	        new SelectListItem { Text = "Show All", Value = "-1", Selected = false }
        },
       SearchPlaceholder = ClientTableConfig.SearchMessage
   })