时间戳

首页 > 解决方案 > 计算 Ajax 请求中返回的对象数

javascript - 计算 Ajax 请求中返回的对象数

问题描述

我的 ajax 请求返回一个 IEnumerable UpcomingGigs，我想计算每个请求返回了多少 Gig。我对此进行了各种尝试，但是每次尝试也包括属性值的计数，因此不是准确的结果。

Console.log(data.Length); var count=Object.keys(data).length;

ajax 数据响应：

两个值都返回相同的错误结果。

public ActionResult FetchGigs(int skip, int take)
        {
            var upcomingGigs = _context.Gigs
                                .Include(g => g.Artist)
                                .Where(g => g.DateTime > DateTime.Now)
                                .OrderBy(d => d.DateTime)
                                .Skip(skip).Take(take);

            var viewModel = new GigsViewModel
            {
                UpcomingGigs = upcomingGigs
            };
            return PartialView("FetchGigs", viewModel);
        }

视图模型

阿贾克斯

    public class GigsViewModel
        {
            public IEnumerable<Gig> UpcomingGigs { get; set; }
            public int TotalGigs { get; set; }
            public bool ShowActions { get; set; }
            public string Heading { get; set; }
        }

$(window).scroll(function () {
                if ($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
                    $.ajax({
                        type: "GET",
                        url: "@Url.Action("FetchGigs")",
                        data: { skip: skip, take: take },
                        success: function (data) {

                            console.log(data.GigsViewModel.gigId.);

                            $(".result").append(data);
                        }
                    })
                }
            });

标签： javascriptjquery.netajaxasp.net-mvc

解决方案

有多种方法可以做到这一点。一种方法是为ul您从局部视图呈现的元素添加一个数据属性，并将项目计数存储在其中。您可以使用该IEnumerable.Count()方法。

@model YourNamespace.GigsViewModel
<ul data-itemcount="@Model.UpcomingGigs.Count()">
    @foreach (var item in Model.UpcomingGigs)
    {
        <li>@item.Title</li>
    }
</ul>

$.parseHTML现在在您的 ajax 成功事件中，使用然后读取数据属性值解析从服务器收到的响应

success: function (data) {
    var html =$.parseHTML(data);
    var itemCount = $(html).data("itemcount");
    alert(itemCount);
}

另一种选择是使用该find方法获取列表项数组并获取它的长度。

success: function(data) {
    var html = $.parseHTML(data);
    var itemCount = $(html).find("li").length;
    alert(itemCount);
}

我会采用第一种方法，因为我不喜欢我的浏览器做这么多工作。（它必须循环遍历此处的 dom 元素才能获得计数）

推荐阅读