[AJAX ASP.NET] DropDownExtender in Gridview

[jsiegmund]

Dit is een (denk ik) een CSS probleem, dus vandaar hier maar eens proberen. Ik heb in ASP.NET een gridview gemaakt waarin ik gebruik maak van de DropDownExtender. Die maakt een SharePoint achtig menuutje voor me aan wat ik aan een link kan hangen. Allemaal handig en leuk, en tot vanochtend werkte het ook nog prima. Nu viel mijn oog op een nieuwere versie van de AJAX Toolkit, dus heb ik die gedownload en geinstalleerd. Sindsdien wordt het dropdownmenuutje in IE achter andere gridview rijen geplaatst. Ik heb al zitten klooien met z-indexes, maar dat lijkt allemaal niks te helpen. In FF rendert de boel wel naar behoren.

De volgende code zorgt voor het menu:

code:

                <ItemTemplate>
                    <asp:Label ID="DateLabel" Text='<%# Eval("Date", "{0:d}") %>' runat="server" CssClass="Link" />
                    
                    <asp:Panel ID="DropPanel" runat="server" CssClass="ContextMenuPanel" Style="display :none; visibility: hidden;">
                        <asp:LinkButton runat="server" ID="OpenButton" Text="Openen" CommandName="OpenDeclaration" CommandArgument='<%# Eval("Date") %>' CssClass="ContextMenuItem" />
                        <asp:LinkButton runat="server" ID="FinishButton" Text="Afsluiten" CommandName="SetFinished" CommandArgument='<%# Eval("DeclarationID") %>' CssClass="ContextMenuItem" />
                        <asp:ImageButton ID="DeleteThumb" runat="server" ImageUrl='~/Images/delete_small.png' CommandName="Delete" CssClass="ContextMenuItem" OnClientClick="return confirm('Wilt u deze gebruiker definitief verwijderen?');"/>
                        <asp:LinkButton runat="server" ID="DeleteButton" Text="Verwijderen" CommandName="Delete" CssClass="ContextMenuItem" OnClientClick="return confirm('Wilt u deze gebruiker definitief verwijderen?');" />
                    </asp:Panel>

                    <ajaxToolkit:DropDownExtender runat="server" ID="DDE"
                        TargetControlID="DateLabel"
                        DropDownControlID="DropPanel" />
                </ItemTemplate>

Daar hangt verder gewoon de standaard CSS/Skin van de Toolkit achter, niet teveel aan veranderd. Iemand enig idee hoe ik IE ervan kan overtuigen dat het menutje gewoon op de voorgrond moet staan?

[BtM909]

Wat is de genereerde code?

[jsiegmund]

Tja of je daar nu echt wat uit kunt halen...

code:

<td>
    <span id="ctl00_ContentPlaceHolder1_DeclarationGridView_ctl02_DateLabel" class="Link">9-2-2007</span>
    <div id="ctl00_ContentPlaceHolder1_DeclarationGridView_ctl02_DropPanel" class="ContextMenuPanel" style="display :none; visibility: hidden;">
        <a id="ctl00_ContentPlaceHolder1_DeclarationGridView_ctl02_OpenButton" class="ContextMenuItem" href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$DeclarationGridView$ctl02$OpenButton','')">Openen</a>
        <a id="ctl00_ContentPlaceHolder1_DeclarationGridView_ctl02_FinishButton" class="ContextMenuItem" href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$DeclarationGridView$ctl02$FinishButton','')">Afsluiten</a>
        <input type="image" name="ctl00$ContentPlaceHolder1$DeclarationGridView$ctl02$DeleteThumb" id="ctl00_ContentPlaceHolder1_DeclarationGridView_ctl02_DeleteThumb" class="ContextMenuItem" src="../../Images/delete_small.png" onclick="return confirm('Wilt u deze gebruiker definitief verwijderen?');" style="border-width:0px;" />
        <a onclick="return confirm('Wilt u deze gebruiker definitief verwijderen?');" id="ctl00_ContentPlaceHolder1_DeclarationGridView_ctl02_DeleteButton" class="ContextMenuItem" href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$DeclarationGridView$ctl02$DeleteButton','')">Verwijderen</a>
    </div>
</td>

Het stuk javascript zit (neem ik aan) ergens weggestopt en wordt pas geinitialiseerd wanneer de pagina laad.

Wat bijbehorende CSS:

code:

.ContextMenuPanel 
{
    display: inline-block;
    visibility: hidden;    
    border: 1px solid #868686;
    background: url(images/menu-bg.gif) repeat-y 0 0 #FAFAFA;
    cursor: default;
    padding: 1px 1px 0px 1px;
    font-size: 11px;
    z-index: 100;
}

[ Voor 13% gewijzigd door jsiegmund op 06-02-2007 15:39 ]

[BtM909]

Heb je iets van een voorbeeld online, want ook hier krijg ik nl. niet het resultaat gesimuleerd

[jsiegmund]

Nee sorry, dat wordt lastig vrees ik. Wat krijg je niet gesimuleerd?

Heb inmiddels de maker van de dropdownextender weten te achterhalen en die had al van meerdere mensen dit probleem doorgekregen. Hij zou er een blik op werpen maar had het nog druk met andere prio's op het moment.

[BtM909]

Ok, dus eigenlijk is dit een thirdparty probleem

[jsiegmund]

Ja zo kun je het zien, maar dan zou ieder probleem met MS componenten een third party probleem zijn

[BtM909]

Klopt, maar je geeft zelf aan dat de maker dit gaat aanpassen, dus wat verwacht je precies van ons?

Als jij een werkende test-case die HTML + CSS uitpoept ergens neer kan zetten, kunnen wij kijken of er aan de clientzijde een oplossing is. Je zit nl. nog steeds in Webdesign, Markup & Clientside Scripting