2011-11-08 16 views
4

自分のウェブサイトのナビゲーションバーを作りたいと思います。このクマにはさまざまなページへのリンクがあり、ユーザーが現在表示しているページへのリンクを強調表示する必要があります。私はこのようなHTMLを持っている瞬間コントロールの子要素をその属性に基づいて検索しますか?

:このような私のPageLoadイベントで

<div id="navbar" runat="server"> 
    <a href="/" runat="server" id="lnkHome">Home</a> | 
    <a href="~/info.aspx" runat="server" id="lnkInfo">Info</a> | 
    <a href="~/contacts.aspx" runat="server" id="lnkContacts">Contacts</a> | 
    <a href="~/settings.aspx" runat="server" id="lnkSettings">Settings</a> 
</div> 

とコード:

//Show the currently selected page 
String filename = System.IO.Path.GetFileNameWithoutExtension(Request.Path).ToLower(); 
if (filename == "default") 
    lnkHome.Attributes.Add("class", "selected"); 
else if (filename == "info") 
    lnkInfo.Attributes.Add("class", "selected"); 
else if (filename == "contacts") 
    lnkContacts.Attributes.Add("class", "selected"); 
else if (filename == "settings") 
    lnkSettings.Attributes.Add("class","selected"); 

これは、維持することは困難です。リンクを追加したい場合は、IDを与え、ifステートメントに情報を追加する必要があります。私はより柔軟なシステムを望んでいます。ここでは、ナビゲーションバーにリンクを動的に追加し、ユーザーが正しいページにいるときにハイライト表示されるようにします。

どうすればよいですか? hrefのプロパティに基づいて、子要素のためにnavbarを検索することはできますか?これらの要素がrunat="server"属性を持つ必要がない場合は、通常のHTMLと同じように扱うことができます。あるいは、私は考慮すべき異なる実装がありますか?

答えて

1

私は、子孫または祖先を見つける必要がある多くの状況に遭遇しました。これに対応して、私はいくつかの拡張メソッドを書いています。

using System.Collections.Generic; 
using System.Web.UI; 

拡張メソッド:

/// <summary> 
/// Finds a single, strongly-typed descendant control by its ID. 
/// </summary> 
/// <typeparam name="T">The type of the descendant control to find.</typeparam> 
/// <param name="control">The root control to start the search in.</param> 
/// <param name="id">The ID of the control to find.</param> 
/// <returns>Returns a control which matches the ID and type passed in.</returns> 
public static T FindDescendantById<T>(this Control control, string id) where T : Control 
{ 
    return FindDescendantByIdRecursive<T>(control, id); 
} 

/// <summary> 
/// Recursive helper method which finds a single, strongly-typed descendant control by its ID. 
/// </summary> 
/// <typeparam name="T">The type of the descendant control to find.</typeparam> 
/// <param name="root">The root control to start the search in.</param> 
/// <param name="id">The ID of the control to find.</param> 
/// <returns>Returns a control which matches the ID and type passed in.</returns> 
private static T FindDescendantByIdRecursive<T>(this Control root, string id) where T : Control 
{ 
    if (root is T && root.ID.ToLower() == id.ToLower()) 
    { 
     return (T)root; 
    } 
    else 
    { 
     foreach (Control child in root.Controls) 
     { 
      T target = FindDescendantByIdRecursive<T>(child, id); 
      if (target != null) 
      { 
       return target; 
      } 
     } 

     return null; 
    } 
} 

あなたのC#のコードビハインド:

var fileName = Path.GetFileNameWithoutExtension(Request.Path); 
var controlId = "lnk" + fileName; 
var anchorTag = navbar.FindDescendantById<HtmlAnchor>(controlId); 
anchorTag.Attributes.Add("class", "selected"); 
ステートメントを使用して

必須:私は、次のコードでこれらを使用することをお勧め

関連する問題