ASP.NET：使用 ImageButton 从 ListView 编辑项目

Question

我在使用 ASP.NET 的 ListView 控件时遇到了一些问题。我正在尝试为每个项目添加编辑选项，如果我使用带有 CommandName="Edit" 的 LinkBut​​ton，它可以工作，但是（这是问题所在）我需要使用 ImageButton 而不是 LinkBut​​ton，它不起作用，虽然我读过这不是问题（http://www.4guysfromrolla.com/articles/061009-1.aspx）。我也尝试将 ImageButton 嵌套在 LinkBut​​ton 中，但它不起作用。

这是我的 ImageButton 标记代码：

<asp:ImageButton ID="editCircleIcon" runat="server" CommandName="Edit" ToolTip="Edit this circle" AlternateText="edit" Width="20px" ImageUrl="~/Images/Circulos/edit_circle.png" style="float:right;" />

我也尝试在 ListView 的 ItemEditing 事件中放置一个断点，但它从未被访问过。

有什么想法吗？

谢谢！！！

PD：这是整个 ListView：

<asp:ListView id="listOfCircles" runat="server" DataKeyNames="id" ItemPlaceholderID="circlePlaceHolder">
    <EmptyDataTemplate>
        <asp:label ID="noCircles" runat="server" Text="No circles defined" />
    </EmptyDataTemplate>

    <LayoutTemplate>
        <asp:Panel ID="circle" runat="server" BorderColor="Black" Width="100%">
            <asp:PlaceHolder runat="server" ID="circlePlaceHolder" />
        </asp:Panel>    
    </LayoutTemplate>

    <ItemTemplate>
        <asp:HiddenField ID="circleID" runat="server" Value='<%# Eval("id") %>' />
        <asp:Panel ID="circleHeader" runat="server" BorderWidth="2px">
            <asp:Image ID="circleIcon" runat="server" />
            <asp:Label ID="circleName" runat="server" Text='<%# Eval("nombre") %>'  />
            <asp:ImageButton ID="deleteCircleIcon" runat="server" ImageUrl="~/Images/Circulos/delete_circle.png" width="20px" style="float:right;" ToolTip="Delete this circle" CommandName="Delete" />
                <ajaxToolkit:ConfirmButtonExtender id="deleteCircleCBE" runat="server"
                                                   DisplayModalPopupID="deleteCircleMPE"
                                                   TargetControlID="deleteCircleIcon" />
                <ajaxToolkit:ModalPopupExtender ID="deleteCircleMPE" runat="server"
                                                BackgroundCssClass="modalBackground" 
                                                PopupControlID="deleteCirclePopup" TargetControlID="deleteCircleIcon"
                                                OkControlID="deleteCircleOk" CancelControlID="deleteCircleCancel"
                                                DropShadow="true" />
                <asp:Panel ID="deleteCirclePopup" runat="server" CssClass="PopUp" style="display:none">
                    <asp:ImageButton ID="deleteCircleClosePopup" runat="server" ImageUrl="~/Images/closePopupIcon.png" CssClass="closePopupImage" OnClientClick="$find('deleteCirclePopup').hide();" />
                    <br /><br /><br />
                    <asp:Label id="deleteCircleMssg" runat="server" Text="Are you sure do you want to delete this circle?" />
                    <br /><br />
                    <asp:LinkButton ID="deleteCircleOk" runat="server" Text="delete" />&nbsp;|&nbsp;
                    <asp:LinkButton ID="deleteCircleCancel" runat="server" Text="cancel" ClientIDMode="Static" />
                </asp:Panel>
                <asp:ImageButton ID="editCircleIcon" runat="server" CommandName="Edit" ToolTip="Edit this circle" AlternateText="edit" Width="20px" ImageUrl="~/Images/Circulos/edit_circle.png" style="float:right;" OnCommand="editCircleIcon_OnClick" />
                <asp:LinkButton ID="editCircleLinkButton" runat="server" CommandName="Edit" ToolTip="Edit this circle" style="float:right;" Text="Edit" />
        </asp:Panel>
        <asp:Panel ID="circleMiddle" runat="server" BorderWidth="2px">
            <asp:Panel ID="users" runat="server">
            <%--espacio para que salgan los usuarios del circulo--%>
            </asp:Panel>
        </asp:Panel>
        <asp:Panel ID="circleFooter" runat="server" BorderWidth="2px">
                <a href="#" onclick='showPopup(newUserPanelPopup, <%# Eval("id") %>)'><img src="/Images/Circulos/add_friend.png" width="20px" alt="Add user" style="margin: 0" title="Add a new user to this circle" /></a>
        </asp:Panel>
        <br /><br />
    </ItemTemplate>

    <EditItemTemplate>
        <asp:Panel ID="circleHeaderEditMode" runat="server" BorderWidth="2px" DefaultButton="editCircleOk" style="background-color:#DDD;">
            <asp:Image ID="circleIcon" runat="server" />
            <asp:TextBox ID="circleNewName" runat="server" Text='<%# Eval("nombre") %>' />
            <asp:Button ID="editCircleCancel" runat="server" Text="Cancel" style="float:right" CommandName="Cancel" />
            <asp:Button ID="editCircleOk" runat="server" Text="Update" style="float:right" CommandName="Update" />
        </asp:Panel>
        <br /><br />
    </EditItemTemplate>

</asp:ListView>

现在，我有两个用于编辑选项的控件，一个不起作用的 ImageButton 和一个 LinkBut​​ton。

再次感谢！

Answer 1

好的，我已经解决了这个问题。我在每个 PostBack 上重新填充 ListView。解决方法很简单：

If Not Me.IsPostBack Then
        ReFillList()
    End If

神秘的是，LinkBut​​ton 似乎并没有为此烦恼，而“删除”选项始终有效……如果有人知道原因，我很想知道原因。

谢谢大家！！

Answer 2

试试这个怎么样。

OnCommand="ImageButton_Command"

这显示了如何连接它。

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.imagebutton.commandname.aspx#Y0

Answer 3

我在我的电脑上测试了这个，我发现如果你的方法背后的代码是这样的

Private Sub editCircleIcon_Command(sender As Object, e As System.Web.UI.WebControls.CommandEventArgs) Handles editCircleIcon.Command
    If e.CommandName = "Edit" Then
       ... //your code
    End If
End Sub

然后你使用你的图片按钮

<asp:ImageButton ID="editCircleIcon" runat="server" CommandName="Edit" ToolTip="Edit this circle" AlternateText="edit" Width="20px" ImageUrl="~/Images/Circulos/edit_circle.png" style="float:right;" />

代码隐藏已执行。如果您发布后面的代码，我可能会更有帮助。

我希望这会有所帮助。