2009-05-31 7 views
0

私はポップアウトメニューを構築しており、クライアントはそれが階層に基づいて連続して飛び出すことができるようにしたいと考えています。例えば不明な数のASP.NETリピータをスタックするにはどうすればよいですか?

、最初のペインには、オプションのリストです。それらを上に置くと、次のレベルのオプションで別のペインがポップアップし、最後のレベルに達するまで続きます。

私はすべてのjavascriptやものを扱うことができますが、私はリピータ内埋め込むリピーターを継続的にする方法を考えることはできません。私はリピーターを別のものの中に入れることでそれを一度行うことができることを知っていますが、それから私は2つの層しか持たないでしょう。

Iはオプションの層毎埋め込みリピータを連続的に、または異なる制御を用いて同様の技術を用いてこれを達成できるようにする必要があります。

すべてのヘルプは素晴らしいです、ありがとう!

答えて

0

あなたは、マークアップでこれを構築することができません。各レベルのRepeaterをビルドして前のRepeaterのテンプレートに追加することで、コード内にコントロールを動的に追加する必要があります。ネストされたリピーターは、選択されたオプションに応じて潜在的に異なる深さになる可能性があるため、選択された各オプションに対して完全なポストバックが必要になります。

あなたはAJAXとJavaScriptを使用して、しかし、すべてのクライアント側のこれをやったほうが良いかもしれません。オプションが選択されると、AJAXリクエストを起動して、そのオプションにサブオプションがあるかどうかを確認します。それが返された場合は、javascriptを使用して新しいオプションコントロールを動的にビルドし、ページに追加します。別のオプションを選択すると、前に選択したオプションのサブオプションを保持するDOMからその要素を削除します。

+0

ありがとうございました。 –

0

MenuItemオブジェクトのリストの形でメニューを表示することができます(それぞれが空の場合もあります)。サブタイトルのリストは実際にはList<MenuItem>を意味します。このサブコレクションはサブリピータのデータソースとしてIEnumerable<T>をプロパティMenuItem.SubItemsとして実装する必要があるため、メニューレベルを1つループして次の呼び出しを呼び出すUserControlをおそらく使用できます。で

UserControlあなたはこのような何かを持っていると思います。各項目テンプレートのために同じことがレンダリングされるようにItemTemplate

<li><a href='<%= this.MenuItem.Url %>'><%= this.MenuItem.LinkText %></a></li> 
<asp:Repeater ID="UCRepeater" runat="server"> 
    <HeaderTemplate> 
     <ul> 
    <ItemTemplate> 
     <menu:MenuItem ID="MenuItemUC" runat="server" /> 
    </ItemTemplate> 
    <FooterTemplate> 
     </ul> 
    </FooterTemplate> 
</asp:Repeater> 

UserControlは、同じものです。以下は

コードは、このユーザーコントロールの背後にある、と魔法が起こる場所です:

public partial class MenuItemUserControl : UserControl 
{ 
    // A property we'll use as the data source 
    public MenuItem MenuItem { get; set; } 

    protected void Page_Load(object sender, EventArgs e) 
    { 
     // If the current menu item has sub items, we bind the repeater to them 
     // And by the way, there is no use doing this on every postback. First 
     // page load is good enough... 
     if(!Page.IsPostBack) { 
     { 
      if(MenuItem.SubItems.Count > 0) 
      { 
       UCRepeater.DataSource = MenuItem.SubItems; 
       UCRepeater.DataBind(); 
      } 
     } 
    } 
    protected void UCRepeater_OnItemDataBound(object sender, 
       RepeaterDataBoundEventArgs e) 
    { 
     // Every time an Item is bound to the repeater, we take the current 
     // item which will be contained in e.DataItem, and set it as the 
     // MenuItem on the UserControl 

     // We only want to do this for the <ItemTemplate> and 
     // <AlternatingItemTemplate> 
     if(e.Item.ItemType == ListItemType.Item || 
      e.Item.ItemType == ListItemType.AlternatingItem) 
     { 
      var uc = (MenuItemUserControl)e.Item.FindControl("MenuItemUC"); 
      if(uc != null) 
      { 
       // This is the magic. Abrakadabra! 
       uc.MenuItem = (MenuItem)e.DataItem; 
      } 
     } 

    } 
} 

だから、仕事にこれを取得するためには、不足している唯一の事は本当にあなたを得るための良い方法ですデータはMenuItemの階層リストとして出力されます。これはあなたのデータアクセスレイヤーに任せます(LINQ to SQLまたはEntity Frameworkを使用すると簡単に安価にできます))

免責事項:このコードはそのまま提供され、私はそれを上から書きました私の頭の。私はそれをテストしていませんが、それはうまくいくと思います。もしそうでなければ、少なくともあなたは問題を解決する方法を知ることができます。問題がある場合は、コメントに投稿してください。私は助けようとしますが、ここで成功するという約束はありません。手伝ってくれるだけの意欲! =)

関連する問題