joshdick
joshdick

Reputation: 1071

How do I set the width of a textbox when editing a row in a GridView?

I've got a GridView that can be edited. My problem is that when I click Edit, the textbox is too small (the File Name column). It isn't large enough to display its contents, and it isn't as wide as the rest of the column.

How can I make that textbox wider?


Here's the ASP code:

<asp:GridView ID="FileGridView" runat="server" AllowPaging="True" OnPageIndexChanging="FileGridView_PageIndexChanging"
    CellPadding="1" CssClass="GridView"  GridLines="Horizontal"
    Width="100%" AutoGenerateColumns="false"
    AutoGenerateEditButton="true"
    OnRowCancelingEdit="GridView_RowCancelingEdit" OnRowEditing="GridView_RowEditing" OnRowUpdating="GridView_RowUpdating"
    >
    <Columns>
        <asp:BoundField DataField="Name" HeaderText="File Name" />
        <asp:BoundField DataField="Length" HeaderText="Size" ReadOnly="true" />
        <asp:BoundField DataField="LastWriteTime" HeaderText="Last Modified" ReadOnly="true" />
    </Columns>
    <RowStyle CssClass="GridViewRow" />
    <EditRowStyle ForeColor="Black" CssClass="GridViewEditRow" />
    <SelectedRowStyle Font-Bold="True" CssClass="GridViewSelectedRow" />
    <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
    <HeaderStyle CssClass="GridViewHeader" ForeColor="White" />
    <AlternatingRowStyle CssClass="GridViewAlternatingRow" />
</asp:GridView>

There's C# code behind this to update the data, and that works just fine. I hope the solution to this is in the ASP, but if the solution requires some C# code, that's OK with me.

Upvotes: 17

Views: 27610

Answers (4)

lincolnk
lincolnk

Reputation: 11238

You can apply a CSS class to the control like this:

<asp:BoundField DataField="Name" HeaderText="File Name" 
    ControlStyle-CssClass="wide" />

And then set your width in your StyleSheet:

input.wide { width: 100px; }

Upvotes: 16

Pieter van Ginkel
Pieter van Ginkel

Reputation: 29632

This should work:

<asp:BoundField DataField="Name" HeaderText="File Name" />
    <controlstyle Width="200">
    </controlstyle>
</asp:BoundField>

Upvotes: 10

Brabbeldas
Brabbeldas

Reputation: 1949

You have to set the ItemStyle-Width for the column and the ControlStyle-Width for the control inside the column:

<asp:BoundField DataField="Name" HeaderText="File Name" />
    <ItemStyle Width="200px" />
    <ControlStyle Width="100%" />
</asp:BoundField>

Upvotes: 5

Sibi Babu
Sibi Babu

Reputation: 9

You can covert the textbox/dropdownbox to a Templatefiled by going to Edit Filed Option. Then go to edit template, define width/height of box.

Upvotes: 0

Related Questions