set column width of a gridview in asp net

Question

I dragged and dropped a GridView from toolbox to Aspx page the design code looks like this   lt asp GridView ID  gridview1  runat  server    style  text-align center width  1327px        CellPadding  4  ForeColor   333333  GridLines  None  AllowPaging  True       EnableSortingAndPagingCallbacks  True  PageSize  50  AutoGenerateEditButton  True  gt       lt AlternatingRowStyle BackColor  White  ForeColor   284775    gt       lt EditRowStyle BackColor   999999    gt       lt FooterStyle BackColor   5D7B9D  Font-Bold  True  ForeColor  White    gt       lt HeaderStyle BackColor   5D7B9D  Font-Bold  True  ForeColor  White    gt       lt PagerStyle BackColor   284775  ForeColor  White  HorizontalAlign  Center           Height  12px  VerticalAlign  Bottom  Width  12px  Wrap  False    gt       lt RowStyle BackColor   F7F6F3  ForeColor   333333    gt       lt SelectedRowStyle BackColor   E2DED6  Font-Bold  True  ForeColor   333333    gt       lt SortedAscendingCellStyle BackColor   E9E7E2    gt       lt SortedAscendingHeaderStyle BackColor   506C8C    gt       lt SortedDescendingCellStyle BackColor   FFFDF8    gt       lt SortedDescendingHeaderStyle BackColor   6F8DAE    gt   lt  asp GridView gt    I have a column by name Address in database The table is bound to this grid view using following VB NET code   Dim ds as Data DataSet  Dim da As New OleDbDataAdapter  select col1 col2 col3 col4 col5 col6 col7 col8 col9 col10 Address from table  con          da Fill ds          gridviewrealestate DataSource   ds         gridviewrealestate DataBind     Now When the gridview is displayed the columns are very close to each other due to large information present in Address Column I want to set the Address Column to a particular width  Please help me how to do this

User · Answer

There are two steps    You must set an appropriate width for GridView like this  Width  2000px   You can set width of Colum by setting  ItemStyle-Width  Like this  ItemStyle-Width  300px         You can set width by setting fixed Pixels like  150 px  or by percentage like 10

User · Answer

You need to convert the column into a  TemplateField    In Designer View  click the smart tag of the GridView  select-   Edit columns   Select your column you wish to modify and press the hyperlink converting it to a template  See screenshot   Converting column to template   Note  Modifying your datasource might regenerate the columns again  so it might make changes to your template columns    Ref  https   msdn microsoft com en-us library bb288032 aspx

User · Answer

I know this is an old Question  but it popped up when I was looking for a solution to the same issue   so I thought that I would post what worked for me    lt asp BoundField DataField  Description  HeaderText  Bond Event  ItemStyle-Width  300px    gt    I used the ItemStyle-Width attribute on my BoundField  and it worked very nicely  I haven t had any issues yet   I didn t need to add anything else to the rest of the code to make this work either

User · Answer

Add HeaderStyle-Width and ItemStyle-width to TemplateFiels     lt asp GridView ID  grdCanceled  runat  server  AutoGenerateColumns  false  OnPageIndexChanging  grdCanceled PageIndexChanging   AllowPaging  true  PageSize  15           CssClass  table table-condensed table-striped table-bordered  GridLines  None  gt                lt HeaderStyle BackColor   00BCD4   ForeColor  White    gt                lt PagerStyle CssClass  pagination-ys    gt                  lt Columns gt               lt asp TemplateField HeaderText  Mobile NO  HeaderStyle-Width  10   ItemStyle-Width  10   gt                   lt ItemTemplate gt                     lt   Eval  mobile     gt                   lt  ItemTemplate gt                  lt  asp TemplateField gt              lt asp TemplateField HeaderText  Name  HeaderStyle-Width  10   ItemStyle-Width  10   gt                   lt ItemTemplate gt                       lt   Eval  name     gt                   lt  ItemTemplate gt               lt  asp TemplateField gt               lt asp TemplateField HeaderText  City  HeaderStyle-Width  10   ItemStyle-Width  10   gt                   lt ItemTemplate gt                       lt   Eval  city     gt                   lt  ItemTemplate gt               lt  asp TemplateField gt               lt asp TemplateField HeaderText  Reason  HeaderStyle-Width  25   ItemStyle-Width  25   gt                    lt ItemTemplate gt                       lt   Eval  reson     gt                    lt  ItemTemplate gt                lt  asp TemplateField gt                lt asp TemplateField HeaderText  Agent  HeaderStyle-Width  10   ItemStyle-Width  10   gt                    lt ItemTemplate gt                        lt   Eval  Agent     gt                    lt  ItemTemplate gt                lt  asp TemplateField gt                lt asp TemplateField HeaderText  Date  HeaderStyle-Width  10   ItemStyle-Width  10   gt                    lt ItemTemplate gt                      lt   Eval  date    0 dd-MMM-yy      gt                    lt  ItemTemplate gt                 lt  asp TemplateField gt                 lt asp TemplateField HeaderText  DList  HeaderStyle-Width  10   ItemStyle-Width  10   gt                     lt ItemTemplate gt                         lt   Eval  service     gt                     lt  ItemTemplate gt                 lt  asp TemplateField gt                 lt asp TemplateField HeaderText  EndDate  HeaderStyle-Width  10   ItemStyle-Width  10   gt                     lt ItemTemplate gt                         lt   Eval  endDate    0 dd-MMM-yy      gt                     lt  ItemTemplate gt                 lt  asp TemplateField gt                 lt asp TemplateField HeaderStyle-Width  5   ItemStyle-Width  5   gt                     lt ItemTemplate gt                          lt asp CheckBox data-needed   lt   Eval  userId     gt   ID  chkChecked  runat  server    gt                      lt  ItemTemplate gt                  lt  asp TemplateField gt                lt  Columns gt             lt  asp GridView gt

User · Answer

Set width     HeaderStyle-width   for Example HeaderStyle-width  10

User · Answer

lt asp GridView ID  GridView1  runat  server  gt       lt HeaderStyle Width  10     gt       lt RowStyle Width  10     gt       lt FooterStyle Width  10     gt       lt Columns gt           lt asp BoundField HeaderText  Name  DataField  LastName               HeaderStyle-Width  10   ItemStyle-Width  10               FooterStyle-Width  10     gt       lt  Columns gt   lt  asp GridView gt

User · Answer

This what worked for me  set HeaderStyle-Width  5    in the footer set textbox width Width  15  also set the width of your gridview to 100   following is the one of the column of my gridview         lt asp TemplateField   HeaderText    sub  HeaderStyle-ForeColor  White  HeaderStyle-Width  5   gt   lt ItemTemplate gt       lt asp Label ID  sub  runat  server  Font-Size  small  Text   lt    Eval  sub    gt   gt  lt  asp Label gt   lt  ItemTemplate gt     lt EditItemTemplate gt       lt asp TextBox ID  txt sub  runat  server  Text   lt    Eval  sub    gt   gt  lt  asp TextBox gt   lt  EditItemTemplate gt    lt FooterTemplate gt       lt asp TextBox ID  txt sub  runat  server  Width  15  gt  lt  asp TextBox gt   lt  FooterTemplate gt

[asp.net] set column width of a gridview in asp.net

Examples related to asp.net

Examples related to aspxgridview