如何从 foreach 循环创建动态 ID答案

【问题标题】：How to create dynamic IDs from a foreach loop如何从 foreach 循环创建动态 ID
【发布时间】：2018-08-28 10:30:51
【问题描述】：

我在 foreach 循环中有一个选项卡列表。有没有办法可以动态添加ID？这样当我单击每个选项卡时，它会加载一个新面板。

标签菜单

<ul class="nav tabs-left tabs-border fullblock">
@foreach (var registrationtarget in Model.Tenants.OrderBy(x => x.Name))
{
    <li class="active">
        <a href="#" data-toggle="tab" aria-expanded="false" title="@registrationtarget.Name"><p class="registrationtarget">@registrationtarget.Name<br />@registrationtarget.TenantGroupName</p>@registrationtarget.CAEIPINumber</a>
    </li>
}

主视图

<article class="row">
    <h1 class="pageTitle artistHeader fw200 mb20 mt10">@ViewBag.Title</h1>
    <div class="col-md-12">

        <div class="row rowflex;">

            <div class="col-md-2 padzero">

                <div class="panel panel-visible" id="tabContainer">

                    @Html.Partial("_VerifiedSongsTabMenu", Model)

                </div>
            </div>
            <div class="col-md-10 padzero">
                <div class="panel panel-visible" id="tableContainer">

                    @Html.Partial("_VerifiedSongsList", Model)

                </div>
            </div>
        </div>
    </div>
</article>

带有 ID 的表格

<div class="tab-block mb25">
@*Panel Body*@
<div class="tab-content">
    <div id="tab14_1" class="tab-pane active">
        <div class="panel-body pn">
            <table class="table table-striped table-hover dataTable admin-form theme-primary verifiedsongsTable" cellspacing="0" width="100%" role="grid">
                <thead id="tableHeader">

我知道使用 JQuery 可以做到这一点，但由于我有一个选项卡列表，我不确定在单击时让选项卡更改内容的最佳方法是什么。

【问题讨论】：

您正在寻求一种方法，因此只需清楚地询问您在寻找什么。代码太长，得到答案的机会很小。 Jquery 数据表很好，你可以使用它。 prabodhsatyal.com/DB/OilList检查一次。
@UjwalNeupane 我正在寻找一种在for 循环中的选项卡列表之间切换的方法。我不认为代码太长，我宁愿把我到目前为止的东西。另外，我不能简单地使用 JQuery，因为每个表的 id 都不同。那我可以根据名字来做吗？
所以您想根据名称添加列表项，或者您想为每个名称添加一个列表项？或者都不是？哈哈
@GeorgeB 令人困惑。所以我有一个选项卡菜单，它使用 foreach 循环生成为选项卡列表。但我想要它，以便我可以更改标签。但我不确定它是否可能？
“改变”是什么意思？更改哪些是可见的或它们持有什么信息？

标签： javascript c# jquery asp.net-mvc razor

【解决方案1】：

您可以尝试使用 ActionLinks：

@Html.ActionLink("Title", "ActionName", "ControllerName", new { area = "" }, new { @class = "Tab"})

然后在控制器中就可以返回新的视图了：

public virtual ActionResult ActionName()
    {
        return View(); //this will return ActionNameView.cshtml
    }

【讨论】：