javascript - 如何使用Data-id发送多个Id

Question

这里是 li，它使用 data-id 发送 Controller ID；

 <li><a href="javascript:;" data-toggle="mftapproveClass" data-title="@item.Name" data-url="@Url.Action("AssignParticipantToClass")" data-id="@item.Id , @item.CourseId , @item.ClassId"><i class="fa fa-thumbs-o-up"></i>Kabul Et</a></li>

这是我自己编写的 js，用于将 1 个 id 发送到 Controller ；

$('[data-toggle="mftapproveClass"]').click(function () {

    var id = $(this).data("id");
    var courseId = $(this).data("courseId");
    var classId = $(this).data("classId");
    var url = $(this).data("url") + "/" + id + "/" + courseId + "/" + classId;
    var title = $(this).data("title");

    bootbox.confirm({
        title: "İşlem Onayı",
        message: "<center><strong>" + title + "</strong> İşlemi onaylıyor musunuz?</center>",
        buttons: {
            'cancel': {
                label: 'İptal',
                className: 'btn-default'
            },
            'confirm': {
                label: 'Tamam',
                className: 'btn-danger blue'
            }
        },
        callback: function (result) {
            if (result) {
                $("#preLoader").fadeIn('fast');
                $.post(url, function (json) {
                    if (json.IsComplete) {
                        $("#" + id).remove();
                        BSToastr.show("success", "Başarılı", "İşleminiz Başarıyla Gerçekleştirildi.");
                    }
                    else {
                        BSToastr.show("error", "Hata", "İşleminiz Gerçekleştirilemedi.");
                    }
                    $("#preLoader").fadeOut('fast');
                });
            }
        }
    });


});

我以前使用 1 个 ID，但现在需要 3 个，我正在尝试更改，但不起作用我试图向 Controller 发送 3 个不同的 ID，但使用 1 个数据 ID 可以工作，但使用 3 个数据 ID 则不起作用。如何发送 3 个 Id

这是输出；

POST http://localhost:17458/Panel/Course/AssignParticipantToClass/413%20,%208%20,%202/undefined/undefined 404 (Not Found)
send @ jquery-1.10.2.min.js:6x.extend.ajax @ jquery-1.10.2.min.js:6x.(anonymous function) @ jquery-1.10.2.min.js:6bootbox.confirm.callback @ global.js:210a.buttons.confirm.callback @ bootbox.min.js:6e @ bootbox.min.js:6(anonymous function) @ bootbox.min.js:6x.event.dispatch @ jquery-1.10.2.min.js:5v.handle @ jquery-1.10.2.min.js:5

Answer 1

您可以将每个属性值添加为 data- 属性

<a href="#" ... data-id="@item.Id" data-courseid="@item.CourseId" data-ClassId="@item.classid">...</a>

然后使用您的脚本中访问它们

var id = $(this).data("id");
var courseId = $(this).data("courseid");
var classId = $(this).data("classid");

请注意，必须使用全小写在 .data() 方法中访问它们。如果您检查 data-cOuRseID="someValue" 生成的 html，您会看到它被转换为小写 - data-courseid="someValue"

例如，除非您为您的方法创建了特定的路由定义

url: "Panel/Course/AssignParticipantToClass/{id}/{courseId}/{classId}"

然后你需要修改你的脚本来使用

var url = $(this).data("url"); // don't add the route values

然后在 .post() 方法中，使用传递值

$.post(url, { id: id, courseId : courseId, classId: classId }, function (json) {