c# - 无法在 JQuery 中获取/绑定(bind)正确的实体 ID，始终从迭代中获取第一个项目 ID

Question

我有一个 PartialView，我可以在其中迭代实体集合并将它们显示在 Html 表中。

此表的其中一列有一个 ，其字体很棒类 (fa fa-times-circle)。

我将此 的“id”属性设置为我正在迭代的对象的“Id”。我正在设置一个 HiddenFor 助手来获取 jQuery 中的 Id，但我总是从 HTML 表中获取顶部项目。

当我查看 HTML 输出时，所有 Id 看起来都很好，但是当我尝试像这样在 jQuery 中获取它时:

<script type="text/javascript">
        $(function () {
        $("body").delegate(".fa", "click", function () {

            //Content to send
            var subscriptionId = $('#Subscription_SubscriptionId').val();

            $.get('@Url.Action("Action", "Controller")', { "subscriptionId": subscriptionId},
                function (result) { $('#SubscriptionBody').html(result); }
                );
         });
         });
</script>

我总是拥有表格顶部的项目。

这就是我在部分 View 中迭代的方式:

foreach (var subscription in Model.Subscriptions)
{
    // tried both HiddenFor & Hidden but same results ... (HiddenFor should be used in my opinion)
    // when iterating all Id's are "good" (Different as they should be)
    @Html.HiddenFor(Model => Model.Subscription.SubscriptionId, new { Value = subscription.SubscriptionId })
    // @Html.Hidden("SubscriptionId", new { Value = subscription.SubscriptionId })

    <tr>           
        <td>@subscription.SubscriptionId</td>            
        <td>... some other values ...</td>  
         @if (condition)
         {
            <td>                    
                <i class="fa fa-user-plus fa-2x" id="@subscription.SubscriptionId"></i>
            </td>
         }
         else
         {
            <td>                   
                <i class="fa fa-times-circle fa-2x" id="@subscription.SubscriptionId"></i>
            </td>
         }
    </tr>
}

我做错了什么？显然我想检索我在表中单击的那个的“subscription.SubscriptionId”，但不知何故它总是占据最上面的那个。

感谢您的建议或解答!

Answer 1

在我看来，你可能会变成这样

var subscriptionId = $(this).attr('id');

解释:

1. $('#Subscription_SubscriptionId').val() 表示:您从 Subscription_SubscriptionId 元素获取值，而不是 fa fa-times-circle 的值。
2. 您可以阅读this @Owais Alam 的回答的帖子，了解 jquery 中 attr 和 data 之间的区别。

或者你可以像这样重构你的代码

HTML:

<i class="fa fa-times-circle fa-2x" data-id="@subscription.SubscriptionId">

Jquery

var subscriptionId = $(this).data('id');