Simon Simon - 17 days ago 5
ASP.NET (C#) Question

Grid view cell spacing in edit mode is asp.net

When I click edit in purchase tab grid view cell mode is fine but in sales tab grid view cell mode not accurate what i want....i don't understand what should i do now...i want sales tab cell mode as purchase tab cell mode. hope you can help me

I'm including picture for better understand

enter image description here


and its html code




<asp:GridView ID="GridView1" runat="server" CssClass="dataGridTable" AutoGenerateColumns="False" Width="100%" AllowPaging="True" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3" DataSourceID="ObjectDataSource1" HeaderStyle-Height="30" OnRowCreated="GridView1_RowCreated" PageSize="30" DataKeyNames="invoiceNumber,productName,productCategory" OnSelectedIndexChanged="GridView1_SelectedIndexChanged" OnRowDeleting="GridView1_RowDeleting" OnRowUpdating="GridView1_RowUpdating" OnRowDataBound="GridView1_RowDataBound">
<Columns>

<asp:CommandField ShowEditButton="true"/>
<asp:TemplateField ShowHeader="False">
<ItemTemplate>
<asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandName="Delete" Text="Delete"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="invoiceNumber" HeaderText="Invoice" ReadOnly="true" SortExpression="invoiceNumber" />
<asp:BoundField DataField="productName" HeaderText="Name" ReadOnly="true" SortExpression="productName" />
<asp:BoundField DataField="productCategory" HeaderText="Category" ReadOnly="true" SortExpression="productCategory" />
<asp:BoundField DataField="totalQuantity" HeaderText="Quantity" SortExpression="totalQuantity" />
<asp:BoundField DataField="totalPurchasePrice" HeaderText="Total Price" SortExpression="totalPurchasePrice" />
<asp:BoundField DataField="salePricePerItem" HeaderText="Sale Price/Item" SortExpression="salePricePerItem" />
<asp:BoundField DataField="comments" HeaderText="Comments" SortExpression="comments" />
<asp:BoundField DataField="date" HeaderText="Date" ReadOnly="true" SortExpression="date" />


<asp:TemplateField>
<ItemTemplate>
<asp:ImageButton ID="ImageButton1" runat="server" Height="24px" ImageUrl="~/Images/detailsInfo.png" Width="24px" OnClick="ImageButton1_Click" />
</ItemTemplate>
</asp:TemplateField>

</Columns>

<FooterStyle BackColor="White" ForeColor="#000066" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" CssClass="gridHeaderAlignment" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<RowStyle ForeColor="#000066" HorizontalAlign="Center" VerticalAlign="Middle" />
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#F1F1F1" />
<SortedAscendingHeaderStyle BackColor="#007DBB" />
<SortedDescendingCellStyle BackColor="#CAC9C9" />
<SortedDescendingHeaderStyle BackColor="#00547E" />
</asp:GridView>





enter image description here


and its html code




<asp:GridView ID="GridView1" runat="server" CssClass="dataGridTable" AutoGenerateColumns="False" Width="100%" AllowPaging="True" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3" DataSourceID="ObjectDataSource1" HeaderStyle-Height="30" OnRowCreated="GridView1_RowCreated" PageSize="30" OnRowDeleting="GridView1_RowDeleting" OnRowUpdating="GridView1_RowUpdating" DataKeyNames="invoiceNumber,productName,productCategory">
<Columns>

<asp:CommandField ShowEditButton="True" />
<asp:TemplateField ShowHeader="False">
<ItemTemplate>
<asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandName="Delete" Text="Delete"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="invoiceNumber" HeaderText="Invoice" ReadOnly="true" SortExpression="invoiceNumber" />
<asp:BoundField DataField="productName" HeaderText="Name" ReadOnly="true" SortExpression="productName" />
<asp:BoundField DataField="productCategory" HeaderText="Category" ReadOnly="true" SortExpression="productCategory" />
<asp:BoundField DataField="totalQuantity" HeaderText="Quantity" SortExpression="totalQuantity" />
<asp:BoundField DataField="totalPrice" HeaderText="Price" SortExpression="totalPrice" />
<asp:BoundField DataField="paidAmount" HeaderText="Paid Amount" SortExpression="paidAmount" />
<asp:BoundField DataField="comments" HeaderText="Comments" SortExpression="comments" />
<asp:BoundField DataField="date" HeaderText="Date" ReadOnly="true" SortExpression="date" />

<asp:TemplateField>
<ItemTemplate>
<asp:ImageButton ID="ImageButton1" runat="server" Height="24px" ImageUrl="~/Images/detailsInfo.png" Width="24px" OnClick="ImageButton1_Click" />
</ItemTemplate>
</asp:TemplateField>

</Columns>

<FooterStyle BackColor="White" ForeColor="#000066" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" CssClass="gridHeaderAlignment" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<RowStyle ForeColor="#000066" HorizontalAlign="Center" VerticalAlign="Middle" />
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#F1F1F1" />
<SortedAscendingHeaderStyle BackColor="#007DBB" />
<SortedDescendingCellStyle BackColor="#CAC9C9" />
<SortedDescendingHeaderStyle BackColor="#00547E" />
</asp:GridView>




Answer

You need ItemStyle and ControlStyle property of bound field. ItemStyle modifies the style for gridview column and ControlStyle modifies the style for control present in gridview column.

    <asp:BoundField DataField="totalQuantity" HeaderText="Quantity" SortExpression="totalQuantity" />
       <ItemStyle Width="200px" />
       <ControlStyle Width="100%" />
    </asp:BoundField>

Adjust the width as per your wish. You could also use ControlStyle-CssClass or ItemStyle-CssClass, if you want to generalized you style.

Comments