c# - gridview CommandField Update & cancel image up down on IE

Question

我正在使用 Gridview。

我的代码是：

<asp:GridView ID="gvReceivers" runat="server" AutoGenerateColumns="False" 
    BackColor="LightGoldenrodYellow" BorderColor="Tan" BorderWidth="1px" 
    CellPadding="2" ForeColor="Black" GridLines="None"
    OnRowEditing="RowEditing" Font-Size="Medium" 
    OnSelectedIndexChanging="gvReceivers_SelectedIndexChanging" 
    onrowcancelingedit="gvReceivers_RowCancelingEdit" 
    onrowdeleting="gvReceivers_RowDeleting" 
            onrowupdating="gvReceivers_RowUpdating">
    <FooterStyle BackColor="Tan" />
        <Columns>
            <asp:CommandField ShowEditButton="True" ButtonType="Image"
                CancelImageUrl="~/Images/Cancel.png" UpdateImageUrl="~/Images/save.png"
                EditImageUrl="~/images/Edit.png" ItemStyle-Width="25px"
                UpdateText="Update" CancelText="Cancel" />
    <asp:CommandField ShowDeleteButton="true" 
                DeleteImageUrl="~/Images/delete.png" ButtonType="Image"
        ItemStyle-Width="25px" />
    <asp:TemplateField>
        <ItemTemplate>
        <asp:ImageButton runat="server" ID="imgSelect" 
                        CommandName="Select" AlternateText="Select"
            ImageUrl="~/Images/allowed.png" />
        </ItemTemplate>
    </asp:TemplateField>

现在，我点击编辑图像。更新和取消图像和事件即将到来。但问题在于 IE 更新和取消图像即将出现和下降。它在 Mozilla 和 chrome 上运行良好。检查下图。

Answer 1

很简单，只需在您的专栏中添加 ItemStyle-Wrap="false" 即可。

Answer 2

似乎您没有为 提供任何宽度ItemTemplate，您可以单独使用两个，ItemTemplate也可以使用单个。

<asp:TemplateField HeaderText="ColumnHeader">
       <EditItemTemplate>
            //You controls
       </EditItemTemplate>
    <ItemStyle Width="30%" />

*编辑 * 您可以点击此链接并相应地更新代码。如果卡在任何地方，那么你可以问我。在这里，我们可以为您提供指导，但您必须自己完成主要任务。

Answer 3

正如 Dorel Domocos 建议的那样，我设法使用CommandField中的ItemStyle Wrap解决了换行问题。

例如：

<asp:CommandField ButtonType="Image" ShowEditButton="True" EditImageUrl="~/images/edit.png" CancelImageUrl="~/images/cancel.png" UpdateImageUrl="~/images/update.png" ItemStyle-Wrap="false" >
    <ItemStyle Wrap="False" Width="48px"></ItemStyle>
</asp:CommandField>

它可以在带有属性的CommandFieldItemStyle-Wrap="false"上，也可以在带有属性的ItemStyle元素上Wrap="False"。

---

生成的结果具有white-space:nowrap;CSS 样式，在编辑模式下具有以下内容：

<td style="width:48px;white-space:nowrap;">
    <input type="image" name="GridView1$ctl02$ctl00" src="images/update.png" alt="Update">
    &nbsp;
    <input type="image" src="images/cancel.png" alt="Cancel" onclick="javascript:__doPostBack('GridView1','Cancel$0');return false;">
</td>

希望能帮助到你。

Answer 4

<asp:TemplateField>
        <ItemTemplate>
        <asp:ImageButton runat="server" ID="imgSelect" 
                        CommandName="Select" AlternateText="Select"
            ImageUrl="~/Images/allowed.png" />
        </ItemTemplate>
 <ItemStyle Width="30%" />
    </asp:TemplateField>