Post
Ask Question

How to Create an HTML Report by Using Inline Code in ASP.NET

Introduction

 
In this article, you will learn how to create an HTML report using inline code in ASP.NET.
 
In one of my previous article, I explained the Difference between Inline Code and Code Behind, in this article, we will use inline code to create an HTML report.
 
Step 1
 
First of all, create a new empty website in your Visual Studio.
 
html3.jpg
 
Now right-click on your website name and then add a new Web Page but while adding this new page ensure that you uncheck the "Place Code in Separate File", otherwise it will not be inline code.
 
html4.jpg
 
Step 2
 
Now create a database of any name and add one table to it. Make some entries in this new table and save it. Like here I created a database named "Test" and a table is added to it named "Employee".
 
html5.jpg
 
Now in Visual Studio add this database by adding it through Server Explorer. Provide all the necessary details for the connection and connect to it.
 
html1.jpg
Step 3
 
Now you need to add a class through which a connection to this database will be declared, for this again right-click on your website and click on "Add New Item" and then add the class.
 
In this class, a connection will be created that will help us to fetch the data from the database. Here the connectme function is used to make the connection with the database and the getvalue function is used to read the data from the database.
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.Data.SqlClient;  
  6.    
  7. public class callme  
  8. {  
  9.     public SqlConnection x = new SqlConnection();  
  10.     public SqlCommand y = new SqlCommand();  
  11.     public SqlDataReader z;  
  12.     public void connectme()  
  13.     {  
  14.    
  15.         x.Close();       
  16.         x = new SqlConnection(@"Data Source=MCNDESKTOP20;Initial Catalog=test;User ID=sa;Password=**********");  
  17.         x.Open();  
  18.     }  
  19.    
  20.     public void getvalue(string task)  
  21.     {  
  22.         connectme();  
  23.         y = new SqlCommand(task, x);  
  24.         z = y.ExecuteReader();  
  25.     }  
  26. } 
Step 4
 
Now you want to go to the Coding Section of the page, then you must double-click on the Design page; double-clicking will not open any new page since here inline code is to be used. Now in the .aspx page we will call the class created above, this can be done by simply dragging the class to the head section.
 
html6.jpg
 
Now we will create an object of this class because we are using the functions declared in the class, and after that, by using these functions we will show the data of the database in the table format.
  1. <%@ Page Language="C#" %>  
  2. <!DOCTYPE html>  
  3. <script runat="server">  
  4. </script>  
  5. <html xmlns="http://www.w3.org/1999/xhtml">  
  6.   
  7.   <head runat="server">  
  8.     <title></title><a href="App_Code/Class1.cs">App_Code/Class1.cs</a>  
  9.   </head>  
  10.   
  11.   <body>  
  12.     <form id="form1" runat="server">  
  13.       <div>  
  14.         <center>  
  15.           <%callme me = new callme(); %>  
  16.           <table border="2">  
  17.             <tr>  
  18.               <td>  
  19.                 <% me.connectme();  
  20.    
  21. me.getvalue("SELECT [ID],[Name],[Salary],[Designation] FROM [Employee]");  
  22.    
  23. if (me.z.HasRows)  
  24. {  
  25.     while (me.z.Read())  
  26.     {       
  27.         string id = me.z["ID"].ToString();  
  28.         string name = me.z["Name"].ToString();  
  29.         string salary = me.z["Salary"].ToString();  
  30.         string desig = me.z["Designation"].ToString();  
  31.            
  32.  %>  
  33.               </td>  
  34.             </tr>  
  35.             <tr>  
  36.               <td>ID: </td>  
  37.               <td>  
  38.                 <%=id%>  
  39.               </td>  
  40.             </tr>  
  41.             <tr>  
  42.               <td>Name: </td>  
  43.               <td>  
  44.                 <%= name %>  
  45.               </td>  
  46.             </tr>  
  47.             <tr>  
  48.               <td>Salary: </td>  
  49.               <td>  
  50.                 <%= salary %>  
  51.               </td>  
  52.             </tr>  
  53.             <tr>  
  54.               <td>Designation: </td>  
  55.               <td>  
  56.                 <%= desig %>  
  57.               </td>  
  58.             </tr>  
  59.             <tr>  
  60.         </center>  
  61.         <%}  
  62.   }  
  63.       %>  
  64.         </tr>  
  65.         </table>  
  66.       </div>  
  67.     </form>  
  68.   </body>  
  69.   
  70. </html> 
Step 5
 
Now if we debug our program then it's output will be something like this:
 
html2.jpg


Recommended Free Ebook
C# Corner Ebook

DateTime in C#

 Download Now!
Similar Articles