0

ポップアウト メニューを作成していますが、クライアントは、階層に基づいて継続的にポップアウトできるようにしたいと考えています。

たとえば、最初のペインはオプションのリストです。それらにカーソルを合わせると、その隣に別のペインがポップアップし、次のレベルのオプションが表示され、最後のレベルのオプションに到達するまで続きます。

私はすべての JavaScript などを処理できますが、リピーター内に継続的にリピーターを埋め込む方法が思いつきません。リピーターを別のリピーターの中に入れることで一度にできることはわかっていますが、それでは2つのレイヤーしかありません.

オプションのレイヤーごとにリピーターを継続的に埋め込むか、別のコントロールを使用して同様の手法でこれを実現する必要があります。

どんな助けでも素晴らしいです、ありがとう!

4

2 に答える 2

0

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

ただし、AJAXとjavascriptを使用して、これをすべてクライアント側で行う方がよい場合があります。オプションが選択されたら、AJAXリクエストを実行して、そのオプションにサブオプションがあるかどうかを確認します。もしそうなら（それらを返す）、javascriptを使用して新しいオプションコントロールを動的に構築し、それをページに追加します。別のオプションを選択すると、以前に選択したオプションのサブオプションを保持している要素をDOMから削除します。

于 2009-05-31T11:55:44.577 に答える
0

オブジェクトのリストの形式でメニューを取得できる場合MenuItem、各オブジェクトにはサブアイテムの (空の場合もある) リストがあります (つまり、List<MenuItem>ここでは、このコレクションをデータソースとして使用します。サブリピーターなので、IEnumerable<T>) をプロパティとして実装する必要がMenuItem.SubItemsあります。おそらく、UserControl1 つのメニュー レベルをループアウトし、次のメニュー レベルを呼び出す a を使用できます。

には、次のUserControlようなものがあります。

<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はItemTemplate同じものであるため、各アイテム テンプレートに対して同じものがレンダリングされます。

以下は、このユーザー コントロールのコード ビハインドであり、ここで魔法が起こります。

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 を使用すると安価で簡単になります... ;))

免責事項: このコードはそのまま提供されており、私は頭のてっぺんから書きました。私はそれをテストしていませんが、うまくいくと思います。うまくいかない場合は、少なくとも問題を解決する方法のアイデアを得ることができます. 問題がある場合は、コメント欄に投稿してください。解決できるように努力しますが、ここでは成功を約束するものではありません。助けたいという気持ちだけです！=)

于 2009-05-31T12:13:35.430 に答える