DOT

VVM

 DOCS

Version: 1.0 | 1.1 |

DataPager

in namespace DotVVM.Framework.Controls.Bootstrap

Extends the builtin DataPager control with Bootstrap CSS classes.

Properties

Name Type Description Notes Default Value
Attributes Dictionary<String,Object>
attribute
inner element
static value
bindable
default
ClientIDMode ClientIDMode Gets or sets the client ID generation algorithm.
attribute
inner element
static value
bindable
default
Static
DataContext Object Gets or sets a data context for the control and its children. All value and command bindings are evaluated in context of this value.
attribute
inner element
static value
bindable
default
DataSet IPageableGridViewDataSet Gets or sets the GridViewDataSet object in the viewmodel.
attribute
inner element
static value
bindable
default
Enabled Boolean
attribute
inner element
static value
bindable
default
True
FirstPageTemplate ITemplate Gets or sets the template of the button which moves the user to the first page.
attribute
inner element
static value
bindable
default
HideWhenOnlyOnePage Boolean Gets or sets whether the pager should hide automatically when there is only one page of results. Must not be set to true when using the Visible property.
attribute
inner element
static value
bindable
default
True
ID String Gets or sets the unique control ID.
attribute
inner element
static value
bindable
default
InnerText String Gets or sets the inner text of the HTML element.
attribute
inner element
static value
bindable
default
LastPageTemplate ITemplate Gets or sets the template of the button which moves the user to the last page.
attribute
inner element
static value
bindable
default
NextPageTemplate ITemplate Gets or sets the template of the button which moves the user to the next page.
attribute
inner element
static value
bindable
default
PreviousPageTemplate ITemplate Gets or sets the template of the button which moves the user to the previous page.
attribute
inner element
static value
bindable
default
RenderLinkForCurrentPage Boolean Gets or sets whether a hyperlink should be rendered for the current page number. If set to false, only a plain text is rendered.
attribute
inner element
static value
bindable
default
False
Size DataPagerSize Gets or sets the size of the data pager.
attribute
inner element
static value
bindable
default
Default
Visible Boolean Gets or sets whether the control is visible.
attribute
inner element
static value
bindable
default
True

Events

Name Type Description

Usage & Scenarios

Extends the builtin DataPager control to set up Bootstrap look of the control.

https://getbootstrap.com/docs/3.3/components/#pagination

HTML Rendered by the Control

Sample 1: DataPager Sizing

Use the Size property to set the size of the pager.

<bs:GridView DataSource="{value: Customers}">
  <Columns>
    <dot:GridViewTextColumn ValueBinding="{value: Id}" HeaderText="ID" />
    <dot:GridViewTextColumn ValueBinding="{value: Name}" HeaderText="Name" />
  </Columns>
</bs:GridView>

<bs:DataPager DataSet="{value: Customers}" Size="Large" />
using System;
using System.Linq;
using System.Threading.Tasks;
using DotVVM.Framework.Controls;
using DotVVM.Framework.ViewModel;

namespace DotvvmWeb.Views.Docs.Controls.bootstrap.DataPager.sample1
{
    public class ViewModel : DotvvmViewModelBase
    {
        private static IQueryable<Customer> FakeDb()
        {
            return new[]
            {
                new Customer(0, "Dani Michele"), new Customer(1, "Elissa Malone"), new Customer(2, "Raine Damian"),
                new Customer(3, "Gerrard Petra"), new Customer(4, "Clement Ernie"), new Customer(5, "Rod Fred"),
                new Customer(6, "Oliver Carr"), new Customer(7, "Jackson James"), new Customer(8, "Dexter Nicholson"),
                new Customer(9, "Jamie Rees"), new Customer(10, "Jackson Ross"), new Customer(11, "Alonso Sims"),
                new Customer(12, "Zander Britt"), new Customer(13, "Isaias Ford"), new Customer(14, "Braden Huffman"),
                new Customer(15, "Frederick Simpson"), new Customer(16, "Charlie Andrews"), new Customer(17, "Reuben Byrne")
            }.AsQueryable();
        }

        private GridViewDataSetLoadedData<Customer> GetData(IGridViewDataSetLoadOptions gridViewDataSetLoadOptions)
        {
            var queryable = FakeDb();
            // NOTE: Apply Pagign and Sorting options.
            return queryable.GetDataFromQueryable(gridViewDataSetLoadOptions);
        }


        public GridViewDataSet<Customer> Customers { get; set; }

        public override Task Init()
        {
            // NOTE: You can also create the DataSet with factory.
            // Just call static method Create with delegate and pagesize.
            Customers = GridViewDataSet.Create(gridViewDataSetLoadDelegate: GetData, pageSize: 4);
            return base.Init();
        }

    }


    public class Customer
    {
        public int Id { get; set; }
        public string Name { get; set; }

        public Customer()
        {
            // NOTE: This default constructor is required. 
            // Remember that the viewmodel is JSON-serialized
            // which requires all objects to have a public 
            // parameterless constructor
        }

        public Customer(int id, string name)
        {
            Id = id;
            Name = name;
        }
    }
}

Suggestions


Help & Contribute

The documentation is maintained on GitHub.
We'll be happy if you edit the page and create a pull request.

Send message