在一個控制器中,它有很幾個視圖,在視圖中有一個菜單。點擊某一菜單,它分切換至對應的視圖,當前的視圖的菜單要高亮顯示。這個要求,也有許多網友問過Insus.NET。今天決定做一個例子,供大家學習與參考。先看看效果: 上圖中,當瀏覽China的視圖時,China這行菜單是Active的,其它沒有效果,依
在一個控制器中,它有很幾個視圖,在視圖中有一個菜單。點擊某一菜單,它分切換至對應的視圖,當前的視圖的菜單要高亮顯示。
這個要求,也有許多網友問過Insus.NET。今天決定做一個例子,供大家學習與參考。
先看看效果:
上圖中,當瀏覽China的視圖時,China這行菜單是Active的,其它沒有效果,依次類說。
接下來,看看菜單的源代碼:
<ul> <li>@Html.ActionLink("Malaysia (2)", "Malaysia", "Career")</li> <li>@Html.ActionLink("Thailand (0)", "Thailand", "Career")</li> <li>@Html.ActionLink("Phillipines (2)", "Philippines", "Career")</li> <li class="active"> @Html.ActionLink("China (0)", "China", "Career")</li> <li>@Html.ActionLink("Hong Kong (0)", "HongKong", "Career")</li> </ul>
當前的源程式是每一個視圖均有此段代碼。變化的地方是class="active"。
Ok,實現此功能,要知道用戶瀏覽的是哪一個視圖。
獲取當前的視圖名,你可以參考這篇《獲取當前視圖名》http://www.cnblogs.com/insus/p/5283729.html
如需要對此菜單作一些維護或是修改,得同時打開這幾個視圖來一起修改。因此我們還得重構這幾個視圖,解決html代碼的冗餘可以新建一個ParitalView來解決。
接下來面對的關鍵的地方要處理在視圖中傳遞一個參數給部分視圖。
創建一個視圖,把菜單html代碼拷貝過去,先保存,後面我們再來修改它:
現在我們需要處理,把當前的視圖名,傳至部分視圖中去的功能。在Models中,創建一個PartialViewParameter類:
這個類中有一個public的屬性,以後我們需要從視圖中傳參數給部分視圖時,就使用這個屬性。
此時我們可以去控制器中創建一個部分視圖操作:
上圖中的紅公箭頭,就是參數傳遞的入口。
下麵的工作,就是分別打開與此有關的各個視圖:
參數已經從視圖傳遞到部分視圖去了,那在部分視圖,怎樣接收與應用此參數呢?
菜單我們不能再直接寫了,需要動態產生: