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,"ProductCancele d") %>&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>

"Greg Smith" <gjs@umn.edu> wrote in message
news:%23xpo6gz6DHA.3420@TK2MSFTNGP11.phx.gbl...

> 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 .
>
>
>
>

[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:

<asp:DataGrid 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>
</asp:DataGrid>

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
[url]http://msdn.microsoft.com/library/en-us/vbcon/html/vbconDataGridWebControl.a[/url]
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
[url]http://support.microsoft.com/?id=812422[/url]

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

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

#Common Datagrid Mistakes
[url]http://msdn.microsoft.com/library/en-us/dnaspp/html/aspnet-commondatagridmis[/url]
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! [url]www.microsoft.com/security[/url]
(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! [url]www.microsoft.com/security[/url]
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

[Roy]

Here's my problem for the curious consumption of the group mind... I
have an embedded datagrid which works fine. The child grid is nested
within the parent using a templatecolumn tag. Using the TR html tag I
can get the child rows to appear below the parent rows (i.e.,
"tree-view style"), BUT I can't get the parent rows to display in a
grid layout. They appear as clumped-up text and all the data runs
together in a line.

In other words, only the first parent row displays fine, then all
preceding parent rows are broke, displaying only as plain text.

Anyone have any formatting/layout tips, techniques, or links?

example:
<asp:datagrid ...>
<asp:boundcolumn ...>
<asp:boundcolumn ...>
<asp:boundcolumn ...>
<asp:templatecolumn ...>
<itemtemplate>
<TR><TD>
<usercontrol:nesteddatagrid ...>
</TD></TR>
....