将列表从cshtml视图传递给jquery函数

本文关键字：jquery 函数 视图 列表 cshtml | 更新日期: 2023-09-27 18:18:04

我试图传递从以下函数生成的列表;

public List<long> GetIDs()
{
    var ids = new List<long>();
    foreach(var s in student)
    {
        ids.Add(s.ID);
    }
    return ids;
}

并通过razor视图传递列表，并在jquery中访问列表。

下面是CSHTML代码:

<a href="#" class="color-blue" data-studentids = "@schoolLicense.GetIDs()" onclick="sendWelcomeEmail(this)">

这是jquery代码我想在这里访问列表并根据得到的id执行操作;

function sendWelcomeEmail(elem) {
    $.each($(elem).attr("data-studentids"), function (index, value) {
        alert(index + ": " + value);
    });
}

但是我并没有从列表中获取id而是得到了错误值

TypeError: invalid 'in' operandobj
Var长度= !!obj,,"length"在obj &&obj.length,

有谁能告诉我我哪里错了吗?

将列表从cshtml视图传递给jquery函数

您的问题是因为通过输出从GetIDs方法返回的List<string>，您只是将其强制转换为字符串。因此你的输出是:

<a href="#" data-studentids="System.Collections.Generic.List`1[System.Int64]" ...

要解决这个问题，您可以将Join()数据放在一起，然后将split()数据放回JS中的数组中。试试这个:

public List<long> GetIDs()
{
    return student.Select(s => s.ID).ToList();
}

<a href="#" class="color-blue" data-studentids="@String.Join(",", schoolLicense.GetIDs())">

$('.colour-blue').click(function(e) {
    e.preventDefault();
    $(this).data('studentids').split(',').forEach(v, i) {
        console.log(i + ": " + v);
    });
});

注意GetIDs方法中LINQ的简化使用，以及JS中不引人注目的事件处理程序的使用。

您可以修改jQuery对象中的.colour-blue选择器以更好地满足您的需求。我只是在这个例子中使用它，因为它是元素上唯一相关的属性。

相关文章：