[RESOLVED]gridview edit / update / cancel button display issue
Hello -
In my gridview, when in non-edit mode, my edit (pencil) and delete (X) buttons show up side-by-side as expected:
Attachment 130089
However, when I click the edit button (pencil) to go into edit mode, the update (diskette) and cancel (undo arrow) appear as shown below, and the edit and delete buttons of the other rows appear the same "wrong" way as well.
Attachment 130091
How can I fix this?
Here is the code for the grid:
Code:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" GridLines="None">
<AlternatingRowStyle BackColor="#F7F4ED" />
<Columns>
<asp:BoundField DataField="Fname" HeaderText="First Name" />
<asp:BoundField DataField="Lname" HeaderText="Last Name" />
<asp:TemplateField HeaderText="Gender">
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bind("StudentGender") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="ddlGender" runat="server" class="text" Style="font-size: 1.6rem;
color: #666; font-weight: bold; text-transform: none;" Height="50px">
</asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Grade">
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("StudentGrade") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="ddlGrade" runat="server" class="text" Style="font-size: 1.6rem;
color: #666; font-weight: bold; text-transform: none;" Height="50px">
</asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="School">
<ItemTemplate>
<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# "~/School-Landing.aspx?scn=" + Eval("SchoolContractNumber").ToString() %>'
Text='<%# Eval("SchoolName") %>'></asp:HyperLink>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="ddlSchools" runat="server" class="text" Style="font-size: 1.6rem;
color: #666; font-weight: bold; text-transform: none;" Height="50px">
</asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Order<br/>Form">
<ItemTemplate>
<asp:ImageButton ID="btnOrderForm" runat="server" ImageUrl="~/img/pdf.gif" OnClick="btnOrderForm_OnClick"
CommandArgument='<%# Eval("SchoolContractNumber").ToString() %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="">
<ItemTemplate>
<asp:Button ID="btnShop" runat="server" Class="small-button" Text="Shop" OnClick="btnShop_OnClick"
CommandArgument='<%# Eval("StudentID").ToString() %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="">
<ItemTemplate>
<asp:ImageButton ID="imgbtnEdit" runat="server" CommandName="Edit" ImageUrl="~/img/glyphicons-31-pencil.png" ToolTip="Edit" />
<asp:ImageButton ID="imgbtnDelete" runat="server" CommandName="Delete" ImageUrl="~/img/glyphicons-193-circle-remove.png" ToolTip="Delete"
OnClientClick="return confirm('Are you sure you want to delete this student?');"
OnClick="DeleteButton_OnClick" CommandArgument='<%# Eval("StudentID").ToString() %>'
/>
</ItemTemplate>
<EditItemTemplate>
<asp:ImageButton ID="imgbtnUpdate" runat="server" CommandName="Update" ImageUrl="~/img/glyphicons-444-floppy-disk.png" ToolTip="Save" />
<asp:ImageButton ID="imgbtnCancel" runat="server" CommandName="Cancel" ImageUrl="~/img/glyphicons-436-undo.png" ToolTip="Cancel" />
</EditItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Re: gridview edit / update / cancel button display issue
Never mind - I resolved the issue by turning off wrap:
<asp:TemplateField HeaderText="" ItemStyle-Wrap="false">