Formatting a datagrid

[Greg Smith]

Hi, I am working on my first web app that uses a datagrid. I can't seem to
find good examples of formatting the grid the way you can in a Windows
application. I am trying to do the following:

private void Page_Load(object sender, System.EventArgs e)
{
string strConnection = "blah, blah blah";
string strSQL = "SELECT RecordID, IP, UserFullName, MachineName,
NodeNumber, SubGroup, MachineLocation, JackNumber, MAC, ServiceTag FROM
tblInfo ORDER BY NodeNumber";

SqlConnection cn = new SqlConnection(strConnection);
SqlCommand cmd = new SqlCommand(strSQL, cn);

cn.Open();
dg.DataSource = cmd.ExecuteReader();
dg.DataBind();
cn.Close();

// dg.<something to make the first column, 'RecordID', not visible>
// dg.<something to change the width of column 'IP'>
// dg.<something to change the column header for 'UserFullName'>
}

Any help is greatly appreciated .

 

[Earl Teigrob]

Greg,

You might want to define your columns maually and and then set the
properties within each one. Make sure you set AutoGenerateColumns="False" .

Earl

Example

<asp:datagrid id="DataGrid2" runat="server" EnableViewState="true"
Width="100%" PagerStyle-CssClass="FValueL"
PagerStyle-Mode="NumericPages" AllowPaging="false" PageSize="50"
HorizontalAlign="Center"
AutoGenerateColumns="False" DataKeyField="pkDownloadMaster"
GridLines="None" CellSpacing="1"
CellPadding="3" AllowSorting="false" ShowFooter="false"
BackColor="#CEDCEC">
<ItemStyle CssClass="DataGridCell"></ItemStyle>
<HeaderStyle CssClass="DataGridHeader"></HeaderStyle>
<FooterStyle CssClass="DataGridFooter"></FooterStyle>
<Columns>
<asp:TemplateColumn>
<ItemStyle VerticalAlign="Top"></ItemStyle>
<HeaderTemplate>
Product No.
</HeaderTemplate>
<ItemTemplate>
<asp:Label id="Label1" runat="server" Text='<%#
DataBinder.Eval(Container.DataItem,"ProductNO") %>&nbsp;' >
</asp:Label>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<ItemStyle VerticalAlign="Top"></ItemStyle>
<HeaderTemplate>
Product Desc.
</HeaderTemplate>
<ItemTemplate>
<asp:Label runat="server" Text='<%#
DataBinder.Eval(Container.DataItem,"ProductDesc") %>&nbsp;' ID="Label3" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<ItemStyle VerticalAlign="Top"></ItemStyle>
<HeaderTemplate>
Download Number
</HeaderTemplate>
<ItemTemplate>
<asp:Label runat="server" Text='<%#
DataBinder.Eval(Container.DataItem,"DownloadNo") %>&nbsp;' ID="Label9" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<ItemStyle VerticalAlign="Top"></ItemStyle>
<HeaderTemplate>
Download Date
</HeaderTemplate>
<ItemTemplate>
<asp:Label runat="server" Text='<%#
DataBinder.Eval(Container.DataItem,"DownloadDate") %>&nbsp;' ID="Label4" />
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn>
<ItemStyle VerticalAlign="Top"></ItemStyle>
<HeaderTemplate>
Canceled Date
</HeaderTemplate>
<ItemTemplate>
<asp:Label runat="server" Text='<%#
DataBinder.Eval(Container.DataItem,"ProductCanceled") %>&nbsp;' ID="Label6"
/>
</ItemTemplate>
</asp:TemplateColumn>
<asp:ButtonColumn Text="Reset" HeaderText="Reset" CommandName="Reset">
<ItemStyle VerticalAlign="Top"></ItemStyle>
</asp:ButtonColumn>
<asp:ButtonColumn Text="Cancel" HeaderText="Cancel"
CommandName="Cancel">
<ItemStyle VerticalAlign="Top"></ItemStyle>
</asp:ButtonColumn>
</Columns>
</asp:datagrid>

 

[Steven Cheng[MSFT]]

Hi Greg,


Thanks for posting in the community!
From your description, you're looking for how to format or customize the
columns' style in webform datagrid control,yes?
If there is anything I misunderstood, please feel free to let me know.

As for this question, I think Earl has provided a good example of how to
manually set the DAtaGrid's columns' style in the DataGrid's code
templdate. For example:

<aspataGrid id="DataGrid1" runat="server">
<EditItemStyle ForeColor="Gray"></EditItemStyle>
<AlternatingItemStyle ForeColor="Lime"
BackColor="Yellow"></AlternatingItemStyle>
<ItemStyle ForeColor="Blue" BackColor="White"></ItemStyle>
<Columns>
<asp:BoundColumn HeaderText="Column1">
<HeaderStyle Width="100px"></HeaderStyle>
</asp:BoundColumn>
<asp:BoundColumn HeaderText="Column2">
<HeaderStyle Width="80px"></HeaderStyle>
</asp:BoundColumn>
<asp:TemplateColumn HeaderText="Column3">
<HeaderStyle Width="50px"></HeaderStyle>
.....
</asp:TemplateColumn>
</Columns>
</aspataGrid>

Also, you can use the IDE to set these attributes. select the datagrid in
design view and choose the "Property Builder..." menu in the right click
context menu. Then, you can set the columns or the Item's Style in the
Format area.

For more detailed info on web form datagrid, you may view the following web
references in MSDN:
#DataGrid Web Server Control
http://msdn.microsoft.com/library/en-us/vbcon/html/vbconDataGridWebControl.a
sp?frame=true

In addtion, here is some other tech articles on using the Webform DataGrid:
#HOW TO: Programmatically Set the DataGrid Column Width to the Longest
Field by Using Visual C# .NET
http://support.microsoft.com/?id=812422

#Extend the ASP.NET DataGrid with Client-side Behaviors
http://msdn.microsoft.com/msdnmag/issues/04/01/CuttingEdge/toc.asp?frame=tru
e

#Creating a Pageable, Sortable DataGrid
http://msdn.microsoft.com/library/en-us/dnaspp/html/aspnet-pageablesortable.
asp?

#Common Datagrid Mistakes
http://msdn.microsoft.com/library/en-us/dnaspp/html/aspnet-commondatagridmis
takes.asp?frame=true

Hope they're also helpful to you. Please check out the above items, if you
need any further help, please feel free to post here.



Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

 

[Steven Cheng[MSFT]]

Hi Greg,


Have you had a chance to try out my suggestion or have you resolved your
problem? If you have any questions or need any further assistance, please
feel free to post here.


Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)