Assine:
[asp.net] Gerar Relatório Em Html
Gerando um simples relatório em html
Escrito por eriva_br em .Net. Data: 27/02/2007
Licença: Alguns direitos reservados. Dar créditos ao autor e linkar este original
Exemplo de relatório em HTML usando C# 2005 e SQL Server, uma alternativa para geração de relatórios somente com as ferramentas do .net e html
No exemplo vamos criar um relatório de Produtos com agrupamento por Categoria, utilizaremos o banco de dados Northwind, as tabelas Categories e Products, relacionando pela coluna CategoryID
usaremos o código C# no mesmo arquivo de design (HTML) com o código nas tags <% %>
Código da página do relatório comentado:
resultado do relatório:
Conclusão: Somente com comandos nativos do .NET e comandos HTML podemos gerar relatórios com uma boa velocidade de desenvolvimento e simplicidade no código.
AUTOR: "eriva_br"
Dúvidas, criticas, contribuições, correções e adições seram bem vindas.
No exemplo vamos criar um relatório de Produtos com agrupamento por Categoria, utilizaremos o banco de dados Northwind, as tabelas Categories e Products, relacionando pela coluna CategoryID
usaremos o código C# no mesmo arquivo de design (HTML) com o código nas tags <% %>
Código da página do relatório comentado:
CODE
<%@ Page Language="C#" %>
<!-- Importando NameSpaces de Dados -->
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<!-- Título da Página -->
<title>Exemplo de Relatório em HTML</title>
<!-- Classe para definição de área não impressa, exemplo botões de Imprimir e Sair -->
<STYLE TYPE="text/css" MEDIA="print">
.noprint {display: none;}
</STYLE>
</head>
<body>
<form id="form1" runat="server">
<!-- Tabela de área não impressa com os botões de Imprimir e Sair, utiliza a classe definida acima: class="noprint" -->
<table class="noprint" align="center" width="85%" border="2" bordercolor="#000000" >
<tr>
<td align="center" CLASS="clsTableBreak" COLSPAN="9">
<div align="center" class="noprint">
<br>
<INPUT type="Button" class="clsButton" value=" Imprimir " onclick="java script: window.print();">
<INPUT type="Button" class="clsButton" value=" Sair " onclick="java script: window.close();">
<br><br>
</div>
</td>
</tr>
</table>
<div>
<!-- Tabela com o título do relatório -->
<table align="center" width="85%" border="2" >
<tr>
<td align="center" colspan="2" style="color: Red; font-size: 150%">
<u><b>RELATÓRIO DE PRODUTOS X CATEGORIA</b></u>
</td>
</tr>
<tr>
</tr>
</table>
<%
if (!IsPostBack)
{
//definindo string de conexão com o banco de dados SQL Server
string cnnStr = "data source=localhost; USER ID=sa; Password=; Initial Catalog=northwind";
//criando e instanciando a váriavel de conexão
SqlConnection con = new SqlConnection(cnnStr);
//criando e instanciando SqlDataAdapter de categorias
SqlDataAdapter dadCats = new SqlDataAdapter("SELECT * FROM Categories", con);
//criando e instanciando SqlDataAdapter de Produtos
SqlDataAdapter dadProd = new SqlDataAdapter("SELECT * FROM Products", con);
//criando e instanciando DataSet para dados do relatórios
DataSet dtsRelat = new DataSet();
//preenchendo DataSet com a tabela de Categorias
dadCats.Fill(dtsRelat, "Categories");
//preenchendo DataSet com a tabela de Produtos
dadProd.Fill(dtsRelat, "Products");
//Criando relacionamento entre Categoria e Produtos pela coluna CategoryID, para futura busca de dados
dtsRelat.Relations.Add("Cat_Prod", dtsRelat.Tables["Categories"].Columns["CategoryID"], dtsRelat.Tables["Products"].Columns["CategoryID"]);
//Loop da tabela Categoria
foreach (DataRow rowCat in dtsRelat.Tables["Categories"].Rows)
{//inserindo dados da tabela categorias
%>
<!-- inicio da tabela de categorias -->
<table align="center" width="85%" border="2" >
<tr align="center">
<td align="right" style="width: 50%">
<b>CATEGORIA:</b>
</td>
<td align="left" style="width: 50%; color: Blue" >
<!-- escrevendo a categoria atual, o "=" substitiu o Response.Output.Write (o resultado final é o mesmo)
Exemplo com o Response.Output.Write
<b><%Response.Output.Write(rowCat["CategoryName"].ToString());%></b>
-->
<b><%=rowCat["CategoryName"].ToString()%></b>
</td>
</tr>
</table> <!-- fechamento da tabela de categorias -->
<!-- inicio da tabela de produtos -->
<table align="center" width="85%" border="2" >
<tr align="center">
<td align="center" style="width: 40%">
<b>PRODUTO</b>
</td>
<td align="center" style="width: 30%">
<b>VALOR UNITÁRIO</b>
</td>
<td align="center" style="width: 30%">
<b>UNIDADES EM ESTOQUE</b>
</td>
</tr>
<%
//Loop da tabela Produtos, buscando registros relacionados pelo relacionamento
foreach (DataRow rowProd in rowCat.GetChildRows("Cat_Prod"))
{//inserindo dados da tabela produtos
%>
<tr align="center">
<td align="left" style="width: 46%">
<%=rowProd["ProductName"].ToString()%>
</td>
<td align="right" style="width: 22%">
<%=rowProd["UnitPrice"].ToString()%>
</td>
<td align="right" style="width: 22%">
<%=rowProd["UnitsInStock"].ToString()%>
</td>
</tr>
<%
} //fim do loop dos produtos
%>
</table> <!-- fechamento da tabela de produtos -->
<%
} //fim do loop das categorias
} //fim do if do postback
%>
</div>
<!-- Tabela de área não impressa com os botões de Imprimir e Sair, utiliza a classe definida acima: class="noprint" -->
<table class="noprint" align="center" width="85%" border="2" bordercolor="#000000" >
<tr>
<td align="center" CLASS="clsTableBreak" COLSPAN="9">
<div align="center" class="noprint">
<br>
<INPUT type="Button" class="clsButton" value=" Imprimir " onclick="java script: window.print();">
<INPUT type="Button" class="clsButton" value=" Sair " onclick="java script: window.close();">
<br><br>
</div>
</td>
</tr>
</table>
</form>
</body>
</html>
<!-- Importando NameSpaces de Dados -->
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<!-- Título da Página -->
<title>Exemplo de Relatório em HTML</title>
<!-- Classe para definição de área não impressa, exemplo botões de Imprimir e Sair -->
<STYLE TYPE="text/css" MEDIA="print">
.noprint {display: none;}
</STYLE>
</head>
<body>
<form id="form1" runat="server">
<!-- Tabela de área não impressa com os botões de Imprimir e Sair, utiliza a classe definida acima: class="noprint" -->
<table class="noprint" align="center" width="85%" border="2" bordercolor="#000000" >
<tr>
<td align="center" CLASS="clsTableBreak" COLSPAN="9">
<div align="center" class="noprint">
<br>
<INPUT type="Button" class="clsButton" value=" Imprimir " onclick="java script: window.print();">
<INPUT type="Button" class="clsButton" value=" Sair " onclick="java script: window.close();">
<br><br>
</div>
</td>
</tr>
</table>
<div>
<!-- Tabela com o título do relatório -->
<table align="center" width="85%" border="2" >
<tr>
<td align="center" colspan="2" style="color: Red; font-size: 150%">
<u><b>RELATÓRIO DE PRODUTOS X CATEGORIA</b></u>
</td>
</tr>
<tr>
</tr>
</table>
<%
if (!IsPostBack)
{
//definindo string de conexão com o banco de dados SQL Server
string cnnStr = "data source=localhost; USER ID=sa; Password=; Initial Catalog=northwind";
//criando e instanciando a váriavel de conexão
SqlConnection con = new SqlConnection(cnnStr);
//criando e instanciando SqlDataAdapter de categorias
SqlDataAdapter dadCats = new SqlDataAdapter("SELECT * FROM Categories", con);
//criando e instanciando SqlDataAdapter de Produtos
SqlDataAdapter dadProd = new SqlDataAdapter("SELECT * FROM Products", con);
//criando e instanciando DataSet para dados do relatórios
DataSet dtsRelat = new DataSet();
//preenchendo DataSet com a tabela de Categorias
dadCats.Fill(dtsRelat, "Categories");
//preenchendo DataSet com a tabela de Produtos
dadProd.Fill(dtsRelat, "Products");
//Criando relacionamento entre Categoria e Produtos pela coluna CategoryID, para futura busca de dados
dtsRelat.Relations.Add("Cat_Prod", dtsRelat.Tables["Categories"].Columns["CategoryID"], dtsRelat.Tables["Products"].Columns["CategoryID"]);
//Loop da tabela Categoria
foreach (DataRow rowCat in dtsRelat.Tables["Categories"].Rows)
{//inserindo dados da tabela categorias
%>
<!-- inicio da tabela de categorias -->
<table align="center" width="85%" border="2" >
<tr align="center">
<td align="right" style="width: 50%">
<b>CATEGORIA:</b>
</td>
<td align="left" style="width: 50%; color: Blue" >
<!-- escrevendo a categoria atual, o "=" substitiu o Response.Output.Write (o resultado final é o mesmo)
Exemplo com o Response.Output.Write
<b><%Response.Output.Write(rowCat["CategoryName"].ToString());%></b>
-->
<b><%=rowCat["CategoryName"].ToString()%></b>
</td>
</tr>
</table> <!-- fechamento da tabela de categorias -->
<!-- inicio da tabela de produtos -->
<table align="center" width="85%" border="2" >
<tr align="center">
<td align="center" style="width: 40%">
<b>PRODUTO</b>
</td>
<td align="center" style="width: 30%">
<b>VALOR UNITÁRIO</b>
</td>
<td align="center" style="width: 30%">
<b>UNIDADES EM ESTOQUE</b>
</td>
</tr>
<%
//Loop da tabela Produtos, buscando registros relacionados pelo relacionamento
foreach (DataRow rowProd in rowCat.GetChildRows("Cat_Prod"))
{//inserindo dados da tabela produtos
%>
<tr align="center">
<td align="left" style="width: 46%">
<%=rowProd["ProductName"].ToString()%>
</td>
<td align="right" style="width: 22%">
<%=rowProd["UnitPrice"].ToString()%>
</td>
<td align="right" style="width: 22%">
<%=rowProd["UnitsInStock"].ToString()%>
</td>
</tr>
<%
} //fim do loop dos produtos
%>
</table> <!-- fechamento da tabela de produtos -->
<%
} //fim do loop das categorias
} //fim do if do postback
%>
</div>
<!-- Tabela de área não impressa com os botões de Imprimir e Sair, utiliza a classe definida acima: class="noprint" -->
<table class="noprint" align="center" width="85%" border="2" bordercolor="#000000" >
<tr>
<td align="center" CLASS="clsTableBreak" COLSPAN="9">
<div align="center" class="noprint">
<br>
<INPUT type="Button" class="clsButton" value=" Imprimir " onclick="java script: window.print();">
<INPUT type="Button" class="clsButton" value=" Sair " onclick="java script: window.close();">
<br><br>
</div>
</td>
</tr>
</table>
</form>
</body>
</html>
resultado do relatório:
Conclusão: Somente com comandos nativos do .NET e comandos HTML podemos gerar relatórios com uma boa velocidade de desenvolvimento e simplicidade no código.
AUTOR: "eriva_br"
Dúvidas, criticas, contribuições, correções e adições seram bem vindas.
Mais recentes em .Net
- Usando fckeditor
- Por Ivan - Bom galera vai aqui mais um tutorial que será bem últil:...
- Lendo arquivos texto
- Por quintelab - Este artigo traz um assunto simples mas que quase todos...
- Formatando colunas da gridview em tempo de execução
- Por quintelab - Este artigo mostra como formatar uma coluna da gridview...
- Carregar página de pesquisa com pop up
- Por quintelab - O artigo mostra como chamar uma página de pesquisa...
- Exibindo mapa usando a api do google.
- Por Ivan - Usando subgurim.net...
Ver mais Artigos de .Net.
Ver e retirar outras dúvidas no fórum Webly.
Alguns Direitos Reservados | RSS | O Fórum
Webly Portal e Fóruns - Internet + Humana | Design by ArthurHenrique.com
Comentários:
eriva_br disse:
<tr><td><div style="page-break-after: always"></div></td></tr>
Ver o restante dos comentários no fórum (e aproveitar pra comentar também !).