dotvvm

DotVVM DataPager not working


dothtml table with DataPager:

<bp:GridView DataSource="{value: UserRoleGroupListDTOs}" class="table table-bordered table-hover dataTable">
                <Columns>
                    <%--<dot:GridViewTextColumn ValueBinding="{value: Name}" HeaderText="Název" Events.Click="{command: GoToDetail() }"/>--%>
                    <bp:GridViewTemplateColumn HeaderText="{resource: eCENTRE.Common.Resources.Admin.Common.Name}">
                        <dot:RouteLink Text="{value: Name}" RouteName="UserRoleGroupDetail" Param-Id="{value: Id}" />
                    </bp:GridViewTemplateColumn>
                    <bp:GridViewCheckBoxColumn ValueBinding="{value: IsBlocked}" HeaderText="{resource: eCENTRE.Common.Resources.Admin.Common.Forbidden}" IsEditable="true"/>
                    <bp:GridViewTemplateColumn HeaderText="{resource: eCENTRE.Common.Resources.Admin.Common.Delete}" CssClass="align center">
                        <%--<i class="glyphicon glyphicon-remove remove-from-list" style="color:red;">
                        </i>--%>
                        <dot:Button class="btn btn-default" Click="{command: _parent.DeleteUserRoleGroup(Id)}" Text="{resource: eCENTRE.Common.Resources.Admin.Common.Delete}"/>

                    </bp:GridViewTemplateColumn>
                </Columns>

            </bp:GridView>
            <bp:DataPager DataSet="{value: UserRoleGroupListDTOs}"/>

ViewModel and init in function Prerender:

public GridViewDataSet<UserRoleGroupListDTO> UserRoleGroupListDTOs { get; set; }

    private readonly IUserRoleGroupFacade userRoleGroupDetailFacade;
    private readonly UserRoleGroupCrudFacade crudFacade;

    public UserRoleGroupListViewModel(IUserRoleGroupFacade userRoleGroupDetailFacade, UserRoleGroupCrudFacade crudFacade)
    {
        this.userRoleGroupDetailFacade = userRoleGroupDetailFacade;
        this.crudFacade = crudFacade;
    }

    public override Task Init()
    {
        return base.Init();
    }
    public override Task PreRender()
    {
        UserRoleGroupListDTOs = new GridViewDataSet<UserRoleGroupListDTO>();
        UserRoleGroupListDTOs.PagingOptions.PageSize = 10;
        UserRoleGroupListDTOs.SortingOptions.SortDescending = true;
        UserRoleGroupListDTOs.SortingOptions.SortExpression = nameof(UserRoleGroupListDTO.Name);
        UserRoleGroupListDTOs.OnLoadingData = options => Task.Run(() => userRoleGroupDetailFacade.GetUserRoleGroupGridViewDataSetLoadedData(options)).Result;

        return base.PreRender();
    }

Pager does show, but after click on any button, nothing is happening.

If I add initialization into Init method, pager works, but viewModel has another errors.


Solution

  • As Tomas wrote, you create new instance of dataset, so you lose PagingOptions.

    You have to init dataset only in new request, not in postbacks.

    public override Task Init()
    {
        if (!Context.IsPostBack)
        {
            UserRoleGroupListDTOs = new GridViewDataSet<UserRoleGroupListDTO>
            {
                PagingOptions = { PageSize = 10 },
                SortingOptions =
                {
                    SortDescending = true,
                    SortExpression = nameof(UserRoleGroupListDTO.Name)
                },
            };
        }
        return base.Init();
    }
    

    Then you have to setup delagate OnLoadingData in load or PreRender

    public override Task PreRender()
    {
        UserRoleGroupListDTOs.OnLoadingData =
            options => Task.Run(() => userRoleGroupDetailFacade.GetUserRoleGroupGridViewDataSetLoadedData(options)).Result;
        return base.PreRender();
    }