使用不同的页面处理选项卡中的子选项卡 - asp .net mvc 3

时间:2012-08-02 19:04:45

标签: c# asp.net-mvc-3 tabs

我正在教自己asp .net mvc3。 我想创建一个用户帐户页面,其中有3个标签 - 比如YourAddress,YourPhotos和YourProfile。

第三个标签(YourProfile)中还有2个子标签... ChangeDetails和DeactiaveAccount。

它们都是动态页面,因此我希望将它们保存为单独的页面。

基本上网址是:

localhost/MyHome/YourAddress
localhost/MyHome/YourPhotos
localhost/MyHome/YourProfile/ChangePassword
localhost/MyHome/YourProfile/DeactivateAccount

(根据要求,我已将通用tab1,tab2等更改为实际场景中的某些内容)

我打算做这样的事情:

public class MyHomeController : Controller
    {
        //
        // GET: /MyHome/Tab1

        public ActionResult Tab1()
        {
            return View();
        }

        //
        // GET: /MyHome/Tab2

        public ActionResult Tab2()
        {
            return View();
        }

        //
        // GET: /MyHome/Tab3

        public ActionResult Tab3()
        {
            return View();
        }
    }

如何处理YourProfile的子标签?如何在控制器内调用控制器?

实现这一目标的最佳方法是什么。

由于

1 个答案:

答案 0 :(得分:1)

为控制器中的每个标签项设置单独的操作方法。

public class MyHomeController : Controller
{
  public ActionResult YourAddress()
  {
     return View();
  }
  public ActionResult YourPhotos()
  {
     return View();
  }
  public ActionResult YouProfile()
  {
     return VieW();
  }
  public ActionResult ChangePassword()
  {
     return View();
  }
  public ActionResult DeActivate()
  {
     return View();
  }
}

对于子选项卡内容,请在global.asax

中定义该路由
routes.MapRoute("ChangePass","YourProfile/ChangePassword", 
                      new { controller="MyHome", action="ChangePassword" });
routes.MapRoute("DeActivate","YourProfile/DeActivate", 
                      new { controller="MyHome", action="DeActivate" });
routes.MapRoute(
           "Default", 
           "{controller}/{action}/{id}", 
           new { controller = "Home", action = "Index", id = UrlParameter.Optional });

始终使用Url.Action Html Helper方法呈现操作方法的路径。

<div id="tabs"> 
    <ul> 
        <li><a href="@Url.Action("YourAddress","MyHome")">Address</a></li>
        <li><a href="@Url.Action("YourPhotos","MyHome")">Photos</a></li>
    </ul>
</div>