如何在asp.net中使列表项可点击答案

【问题标题】：How to make a list item clickable in asp.net如何在asp.net中使列表项可点击
【发布时间】：2021-08-14 13:03:34
【问题描述】：

我正在根据来自我的数据库的数据动态构建一个列表我正在尝试使每个列表项都可单击，这样当单击一个列表项时，我可以重定向到我的控制器“请求”并在该控制器“详细信息”中输入操作

列表成功构建并显示，唯一的问题是列表项本身不可点击，因此我无法重定向到我的控制器并继续执行其余逻辑

下面是我的代码）请注意下面的代码在 _Layout.cshtml 页面内

 <div id="notifications">
        <h3 class="notify"><b>Notifications</b></h3>
        <div style="height:300px;">

            <ul id="notiContent">
                @if (ViewData["MessageList"] != null)
                {

                    var viewDataProd = ViewData["MessageList"] as List<Notification>;
                    @for (var i = 0; i < viewDataProd.Count; i++)

                    {
                        @*<li class="notiContentLi"> <a asp-controller="Requisition" asp-action="Details" asp-route-id="@viewDataProd[i].RequisitionId"></a> @viewDataProd[i].Action</li>*@
                        @*<li class="notiContentLi"> <a asp-controller="Requisition" asp-action="Details" asp-route-id="@viewDataProd[i].RequisitionId"></a> @viewDataProd[i].Action</li>*@
                        <li class="notiContentLi"><a href='@Url.ActionLink("Details","Requisition",new{@viewDataProd[i].RequisitionId})'>click me </a>@viewDataProd[i].Action</li>


                    }

                }

                @if (GlobalVariables.messageList != null)
                {

                    var viewDataProd = GlobalVariables.messageList as List<Notification>;
                    @for (var i = 0; i < viewDataProd.Count; i++)

                    {
                    
                        @*<li class="notiContentLi">@c.Action<br />  </li>*@
                        @*<li class="notiContentLi" asp action>@viewDataProd[i].Action</li>*@
                        <li class="notiContentLi"><a href='@Url.ActionLink("Details","Requisition",new{@viewDataProd[i].RequisitionId})'> click me </a>@viewDataProd[i].Action</li>
                    }

                }

            </ul>
        </div>
    <div class="seeAll"><a href="#">See All</a></div>
   </div>

【问题讨论】：

标签： asp.net-mvc list razor razor-pages

【解决方案1】：

您可以将onclick 事件添加到<li> 标签：

@for (var i = 0; i < viewDataProd.Count; i++)
{
    <li class="notiContentLi" onclick="location.href = '@(Url.Action("Details", "Requistion", new { id = viewDataProd[i].RequisitionId }))'" >@viewDataProd[i].Action</li>
}

而Requistion控制器中的Details动作方法声明为：


public ActionResult Details(int id)
{
    // Add your action code here... 
}

【讨论】：

【解决方案2】：

添加路由值和 html 属性就可以了

 var viewDataProd = GlobalVariables.messageList as List<Notification>;
    @for (var i = 0; i < viewDataProd.Count; i++)
     {
                                                 
       <li class="notiContentLi">@Html.ActionLink(@viewDataProd[i].Action, "Details", "Requisition", routeValues: new { @viewDataProd[i].RequisitionId }, htmlAttributes: new { target = "_blank" })</li>
     }

【讨论】：