单击MVC中的链接时如何打开相应的视图

时间:2018-08-28 09:05:27

标签: jquery asp.net-mvc

当我单击MVC中的链接时,我想打开相应的视图。

_Layout

<li>@Html.ActionLink("Racing", "Reports", "Reports", null, null, "RacingFilter", null, new { @id = "RacingId" })</li>
<li>@Html.ActionLink("Sire", "Reports", "Reports", null, null, "SireReportsFilter", null, new { @id = "SireId" })</li>

报告视图

   <ul class="nav nav-tabs">        
        <li><a data-toggle="tab" href="#racing">Racing Reports</a></li>
        <li><a data-toggle="tab" href="#sire">Sire Reports</a></li>
    </ul>
    <div class="tab-content">           
        <div id="racing" class="tab-pane fade">
            @Html.Partial("~/Views/Racing/Racing.cshtml", Model.clsRacing)
        </div>
        <div id="sire" class="tab-pane fade">
            @Html.Partial("~/Views/SireReports/SireReports.cshtml", Model.clsSireReports)
        </div>

    </div>

jQuery

   $('#RacingId').click(function (e)            
            $('#racing').show();
        });

1 个答案:

答案 0 :(得分:0)

您要执行的操作不起作用,因为在将您重定向到新页面之前,jquery click事件将触发。你可以这样。

您可以使用操作链接来发送另一个参数。

@Html.ActionLink("Racing", "Reports", "Reports", null, null, "RacingFilter", new { tab = "RacingTab" }, new { @id = "RacingId" })
@Html.ActionLink("Sire", "Reports", "Reports", null, null, "SireReportsFilter", new { tab = "SireTab" }, new { @id = "SireId" })

在您的控制器中,您检索此值并将其保存在Viewbag中,或将其添加到模型中以将其传递到页面中。

 public ActionResult Reports(string tab)
 {
      this.ViewBag.Tab = tab;
      return this.View(Model);
 }

在报告视图中,您可以执行此操作

   <script>
       $(document).ready(function() {
           $("#@ViewBag.Tab").tab('show');
       });
   </script>
   <ul class="nav nav-tabs">        
        <li><a id="RacingTab" data-toggle="tab" href="#racing">Racing Reports</a></li>
        <li><a id="SireTab" data-toggle="tab" href="#sire">Sire Reports</a></li>
    </ul>
    <div class="tab-content">           
        <div id="racing" class="tab-pane fade">
            @Html.Partial("~/Views/Racing/Racing.cshtml", Model.clsRacing)
        </div>
        <div id="sire" class="tab-pane fade">
            @Html.Partial("~/Views/SireReports/SireReports.cshtml", Model.clsSireReports)
        </div>
    </div>

这应该有效。

别忘了Viewbag仅会持续一个请求,因此,如果您要在控制器上进行任何重定向,则需要进行一些调整。