繁体   English   中英

Kendo MVC ListView小部件无限滚动不起作用

[英]Kendo MVC ListView widget endless scrolling not working

Kendo UI for MVC的最新版本之一在其ListViews上包含.Scrollable(ListViewScrollableMode.Endless)功能,这是我在此处遇到的问题,其他我发现的具有相同标题的问题是指“剑道早期版本中的“自制”解决方案。

我的问题:

我在这里遵循了Kendo指南: https ://demos.telerik.com/aspnet-mvc/listview/endless-scrolling-解释了如何将无限滚动添加到ListView小部件,因此我整理了以下代码:

HTML页面:

    <script type="text/template" id="reportManagementTemplate">
    <div class="nameBlock">
        <h3 class="nameHeader">#:Username#</h3>
    </div>
</script>

<script type="text/template" id="reportManagementAltTemplate">
    <div class="nameBlock k-alt">
        <h3 class="nameHeader">#:Username#</h3>
    </div>
</script>

<div class="k-content">
    @(Html.Kendo().ListView<Governance.Models.DTO.ReportManagementUsernamesDTO>()
        .Name("ReportUsernameList")
        .TagName("div")
        .ClientTemplateId("reportManagementTemplate")
        .ClientAltTemplateId("reportManagementAltTemplate")
        .Selectable(s => s.Mode(ListViewSelectionMode.Single))
        .HtmlAttributes(new { style = "height:350px; width: 200px;" })
        .Scrollable(ListViewScrollableMode.Endless)
        .DataSource(datasource =>
        {
            datasource.Read(read => read.Action(MVC.TaskReportManagement.ActionNames.ReportManagementList_Read, MVC.TaskReportManagement.Name));
            datasource.PageSize(9);
        })
    )
</div>

CSS:

    .nameBlock {
    float: left;
    position: relative;
    width: 200px;
    height: 100px;
    padding: 0;
}

.nameHeader {
    margin-left: 5px;
}

读取的语句返回的字符串等于我设置的页面大小,当所有这些代码运行后,我得到以下信息:

我的问题图片

因此,您可以看到,列表视图中的项目不在容器周围,任何人都可以解决此问题吗?

事实证明,在更新kendo之后,我的脚本不是最新的,它们仍然指向2017文件夹而不是2019文件夹。现在已解决问题。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM