Question

我有这个新的Kendo ListView以无限滚动开始，事实是当列表返回NULL时，控制台中会出现错误。 NULL不是一个对象，事实是，对于其他列表我有加载器出现并且不会停止加载并且不允许您做任何事情。最好的解决方案是没有显示结果，但我没有办法显示总结果。 datasource.total（）总是显示0.我真的没有关于如何做到这一点的想法。我将不胜感激。我会发布我的代码。对不起我的英文不好。

function funcion() {
var dataSource_seguidores_articulos = new kendo.data.DataSource({
    autoSync: true,
    transport: {
        read:  {
            url: "xxxxxxxx",
            dataType: "jsonp",
            data: {token: xxx, motivo: x}
        }
    },
    schema: {
        data: "results",
        total: "total"
    },
    pageSize: 10,
    serverPaging: true
});

$("#listview").kendoMobileListView({
    dataSource: dataSource_seguidores_articulos,
    template: $("#template").text(),
    endlessScroll: true
});

}

对于不显示和产生冲突的错误，最好的想法是做类似的事情：

if（datasource.total（）=== 0） { 没有结果 } 其他 { LISTVIEW的代码 }

PHP AJAX URL API返回此

jQuery1910311110318871215_1397568743279(({ "results":null, "total": 1})

但数据源总计显示为0.提前感谢

Answer 1

我过去处理这个问题的方法是MVVM绑定我的列表的可见性和一个＆＃34;没有结果＆＃34;消息到项目的计数。类似的东西：

<div data-bind="visible: hasData">
    <ul data-role="listview" data-bind="source: data" data-template="list-template"></ul>
</div>
<div data-bind="invisible: hasData">
    <span>No Records.</span>
</div>

在JS中：

var ds = kendo.DataSource({...});

ds.bind("change", function () {
    vm.set("hasData", ds.total() > 0);
});

var vm = kendo.observable({
    hasData: false,
    data: ds
});

Answer 2

如果您想要一个介入性较低的解决方案并且可以使用所有实例的通用消息，则可以使用CSS来处理此问题。

[data-role="listview"]:empty::after {
    content: 'No records to show';
}

我个人喜欢这个，因为我不必传递空元素的ID，或者用JS定位每个元素。它也不会改变DOM，这可能会阻止Kendo正常运行。当记录可用时，此解决方案将更新。

更新：此解决方案在IE11中存在问题。文本将出现在一些填充的列表中，并且一旦屏幕绘制因鼠标移动而消失

Answer 3

您可能必须手动替换kendo listview内容。我知道，例如，kendo网格没有空数据模板所以在数据绑定事件中我检查tbody的表内容并从那里开始。在您的特定情况下，您可能需要测试有多少＆＃39; li＆＃39;标签标记项目在ul.km-listview中。如果长度为零，您可以插入自己的格式化的li项目，显示＆＃34; No Items Available＆＃34;：

<li class="km-group-container">
    <div class="km-group-title">
        <div class="km-text">No Items Available</div>
    </div>
    <ul class="km-list">
        <li data-icon="toprated">
            <a class="km-listview-link" data-role="listview-link">
                <span class="km-icon km-toprated"></span>Please try again.</a>
        </li>
    </ul>
</li>

祝你好运

<强>更新在你的onGridDatabound事件中尝试这个：

var listElement = $("#yourlistname li");
if (listElement.size() == 0) {
     $("#yourlistname").append("the empty html above");
}

Answer 4

     var listViewModel = kendo.observable({
                listData: ListModel
            });
            listViewModel.bind('change', function (e) {
                if (e.items.length > 0) {
    refreshList();
                } else {
                     $('#noresult-alert').data('kendoMobileModalView').open();
                }
            });
    div-#noresult-alert is a kendoui mobile mdalview may have your custom message.
Note:using modalview may open once ata a time and no need of handle any stoppropagation here since fwk doesn't provide it internally.

我怎样才能显示＆＃34;没有结果＆＃34;在kendo Mobile ListView中

4 个答案: