使用javascript动态设置asp-route-id的值而不使用foreach循环

时间:2016-05-03 06:56:58

标签: asp.net-core asp.net-core-mvc

我正在开发一个ASP.Net MVC 6应用程序。默认索引视图通常包含foreach循环内的Edit,Details和Delete的链接,如

@foreach (var item in Model) {
        <tr>
            <td>@Html.DisplayFor(modelItem => item.FirstName)</td>
            <td>@Html.DisplayFor(modelItem => item.LastName)</td>
            <td>
                <a asp-action="Edit" asp-route-id="@item.SpeakerId">Edit</a> |
                <a asp-action="Details" asp-route-id="@item.SpeakerId">Details</a> |
                <a asp-action="Delete" asp-route-id="@item.SpeakerId">Delete</a>
            </td>
        </tr>
    }

我的要求是View,Edit&amp;删除应出现在表格外,应使用单选按钮列选择行。

有没有办法使用radiobutton的onchange事件动态设置asp-route-id属性?

我尝试了一些链接

function radioSelected() {        
        var routeId = $('input[name="selectRecord"]:checked').val();
        var links = "<a asp-action='Details' asp-route-id=" + routeId + ">View Details</a> | "
                    + "<a asp-action='Edit' asp-route-id=" + routeId + ">Edit</a> | "
                    + "<a asp-action='Delete' asp-route-id=" + routeId + ">Delete</a>";

        document.getElementById("actions").innerHTML = links;
    }

但是asp-route-id和asp-action属性不会这样工作。

1 个答案:

答案 0 :(得分:0)

如果可能,您可以使用jquery。我在下面添加了一部分来处理你的案子:

<a id="lnkEdit" data-url-prefix="@Url.Action("Edit")">Edit</a> |
<table id="tableSelect">
    @foreach (var item in Model)
    {
        <tr data-item-id="@item.SpeakerId">
            <td><input name="selectRow" type="radio"></td>
            <td>@Html.DisplayFor(modelItem => item.FirstName)</td>
            <td>@Html.DisplayFor(modelItem => item.LastName)</td>
        </tr>
    }
</table>


<script type="text/javascript">
     $(function () {
         $('#tableSelect tr').click(function () {
             $(this).find('td input:radio').prop('checked', true);
             $("#lnkEdit").attr("href", $("#lnkEdit").data("url-prefix") + "/" + $(this).data("item-id"));
         })
     });
</script>