La modification d'une ligne Gridview avec des listes déroulantes est trop large - comment puis-je utiliser des panneaux contextuels à la place?

Question

J'ai une série de GridViews dans un panneau d'onglets - databound à une liste générique d'objets métier.

Les colonnes du Gridview sont similaires à ce qui suit:

<asp:TemplateField HeaderText="Company" SortExpression="Company.ShortName"> 
    <ItemTemplate> 
     <asp:Label ID="lblCompany" runat="server" Text='<%# Bind("Company.ShortName") %>'></asp:Label> 
    </ItemTemplate> 
    <EditItemTemplate> 
     <asp:DropDownList ID="ddlCompany" runat="server"></asp:DropDownList> 
    </EditItemTemplate> 
</asp:TemplateField> 

Le GridView génère le lien « Modifier » au début de la ligne, tous les événements ok feu. Le problème est que les données deviennent longues. En mode 'affichage', c'est bien parce que le contrôle GridView est assez intelligent pour décomposer du texte en plusieurs lignes (en particulier les noms Project, Title et Worker peuvent devenir assez longs).

Le problème vient en mode d'édition. Les listes déroulantes NE divisent PAS les entrées en plusieurs lignes (pour des raisons évidentes). Aller dans ode d'édition sur une ligne dans Gridview peut faire croître horizontalement le Griview à deux fois la taille de l'écran (soufflant à travers les limites de largeur dans la page principale et CSS mais c'est seulement un problème lié). Ce dont j'ai besoin est quelque chose comme le ModalPopup - mais essayer de l'attacher à un ID dans un EditItemTemplate me donne des erreurs quand la page s'affiche (parce que le 'ddlXXXX' n'existe pas à ce moment). En outre, je ne sais pas comment remplir dynamiquement le panneau afin que je puisse obtenir une réponse de celui-ci (comme l'ID de la société qu'ils ont sélectionné). J'essaie également d'éviter le javascript et je voudrais que ce soit une solution «pure» aspx/code-behind (par souci de simplicité entre autres).

Tous les exemples que je trouve sont des Popups Modal avec les panneaux prédéfinis. Même si (le panneau contextuel) était quelque chose comme une liste de cases à cocher, il pourrait être databound à la SortedList que j'ai prêt et une combinaison de boutons OK/Annuler pour accepter ou ignorer les choses. Je ne suis pas sûr de ce qui va où.

Je suis ouvert aux suggestions. Merci d'avance.

EDIT: La solution finale se présente comme suit:

<asp:TemplateField HeaderText="Company" SortExpression="Company.ShortName"> 
    <ItemTemplate> 
     <asp:Label ID="lblCompany" runat="server" Text='<%# Bind("Company.ShortName") %>'></asp:Label> 
    </ItemTemplate> 
    <EditItemTemplate> 
     <asp:LinkButton ID="lnkCompany" runat="server" Text='<%# Bind("Company.ShortName") %>'></asp:LinkButton> 
     <asp:Panel ID="pnlCompany" runat="server" style="display:none"> 
      <div> 
       <asp:DropDownList ID="ddlCompany" runat="server" ></asp:DropDownList> 
       <br/> 
       <asp:ImageButton ID="btnOKCo" runat="server" ImageUrl="~/Images/greencheck.gif" OnCommand="PopupButton_Command" CommandName="SelectCO" /> 
       <asp:ImageButton ID="btnCxlCo" runat="server" ImageUrl="~/Images/RedX.gif" /> 
      </div> 
     </asp:Panel> 
     <cc1:ModalPopupExtender ID="mpeCompany" runat="server" 
       TargetControlID="lnkCompany" PopupControlID="pnlCompany" 
       BackgroundCssClass="modalBackground" CancelControlID="btnCxlCo" 
       DropShadow="true" PopupDragHandleControlID="pnlCompany" /> 
    </EditItemTemplate> 
</asp:TemplateField> 

Et dans le code-behind, lstIDLabor est la liste générique de lignes de données (dont la société est l'une des propriétés qui est aussi un objet métier) qui est lié à la GridView:

Sub PopupButton_Command(ByVal sender As Object, ByVal e As CommandEventArgs) 
    Dim intRow As Integer 
    Dim intVal As Integer 
    RestoreFromSessionVariables() 
    Select Case e.CommandName 
     Case "SelectCO" 
      intRow = grdIDCostLabor.EditIndex 
      Dim ddlCo As DropDownList = CType(grdIDCost.Rows(intRow).FindControl("ddlCompany"), DropDownList) 
      intVal = ddlCo.SelectedValue 
      lstIDLabor(intRow).CompanyID = intVal 
      lstIDLabor(intRow).Company = Company.Read(intVal) 
     Case Else 
      ' 
    End Select 
    MakeSessionVariables() 
    BindGrids() 
End Sub 

Answer 1

Que pensez-vous de cela?

<asp:TemplateField HeaderText="Company" SortExpression="Company.ShortName"> 
<ItemTemplate> 
    <asp:Label ID="lblCompany" runat="server" Text='<%# Bind("Company.ShortName") %>'></asp:Label> 
</ItemTemplate> 
<EditItemTemplate> 
    <asp:LinkButton ID="EditBtn" runat="server" Text='<%# Eval("Company.ShortName") %>' /> 
     <asp:Panel ID="Panel1" runat="server" Style="display: none" CssClass="modalPopup"> 
     <div> 
      <asp:DropDownList ID="ddlCompany" runat="server" SelectedValue='<%# Bind("Company.ID")></asp:DropDownList><br/> 
      <asp:ImageButton ID="OkButton" runat="server" ImageUrl="~/Images/OkBtn.png" /> 
      <asp:ImageButton ID="CancelButton" runat="server" ImageUrl="~/Images/Cancel.png" /> 

      </div> 
     </div> 
     </asp:Panel> 
     <act:ModalPopupExtender ID="ModalPopupExtender" runat="server" TargetControlID="EditBtn" 
     PopupControlID="Panel1" BackgroundCssClass="modalBackground" CancelControlID="CancelButton" 
     DropShadow="true" PopupDragHandleControlID="Panel1" /> 
</EditItemTemplate> 

Donc lorsque vous modifiez vous voyez la société en tant que linkButton et lorsque vous cliquez sur vous obtenez la fenêtre avec le menu déroulant qui est déjà binded à l'ID de l'entreprise