Question

我正在将MVC 5用于我的Web应用程序项目。我创建了一个由MVC自己完成的表的内置列表。现在我想得到我点击的数据的ID。 MVC本身创建了一个编辑/删除选项，但我想让整行成为一个可点击的选项，这样当我按下其中一行时，我会将我链接到该ID的详细信息。问题是当我点击该行时，我无法将id传递给javascript。我试图搜索它，我发现像这样的东西var id = $（'。clickableRow'）。attr（“data-id”）; 但它只显示未定义的值。

这是我的index.cshtml源代码

@foreach (var item in Model){
<tr id="clickableRow(this)">
    <td>
        @Html.DisplayFor(modelItem => item.SentBy)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.SentTo)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Subject)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.SentDate)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Message)
    </td>
    <td>

        @Html.ActionLink("Details", "Details", new { id = item.MailId }) |
        @Html.ActionLink("Delete", "Delete", new { id = item.MailId })
    </td>
</tr>

}

这里是我试图使用的javascript：

<script type="text/javascript">
$(document).ready(function () {
    $('.clickableRow').on('click', function (e) {
        var id = $(this).closest('tr').find('td.SentBy').html();
        //var id = $('.clickableRow').attr("data-id");
        alert(id);
        //window.location = "Mails/Details/" + id;
        // Or, we can grab the HREF from the first anchor:
        //window.location = $('a:first', this).attr('href');
    });
});

提前感谢您的帮助。

Answer 1

您<tr id="clickableRow(this)">似乎（错误地）认为id属性是onclick之类的事件。此外，您尝试以data属性身份访问该ID，这需要以data-为前缀，即data-id，我不确定{{1}的位置} class来自于，因为没有任何类被分配给示例行。

我对.NET一无所知，但您应该将实际记录ID放在.clickableRow属性中：

data-id

<tr class="clickableRow" data-id="OUTPUT_ID_HERE">

Answer 2

在您的JavaScript中，您尝试访问class元素，就像您在HTML中定义了ID属性一样。

尝试将JavaScript更改为

$(document).ready(function () {
    $('#clickableRow').on('click', function () {
        var $this = $(this);
        var id=$this.attr("data-id");
        alert(id);
    });
});

使用javascript从bootstrap表中检索id

2 个答案: