在ASP.NET html表中显示数据

Question

I am writing an ASP.NET page which reads data from a database and needs to show it in a table. For some reason, I don't want to use the gridView.

How do I show the data in a table on the HTML page?

This is my C# code:

        SqlConnection thisConnection = new SqlConnection(dbConnection);
        SqlCommand thisCommand = thisConnection.CreateCommand();
        thisCommand.CommandText = "SELECT * from Test";
        thisConnection.Open();
        SqlDataReader reader = thisCommand.ExecuteReader();

        while (reader.Read())
        {
            int id = reader.GetInt32(0);
            string Name = reader.GetString(1);
            string Pass = reader.GetString(2);                   
        }

        thisConnection.Close();

This is my ASPX page:

<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/test.master" CodeFile="test.aspx.cs" Inherits="test" %>

<asp:Content ID="BodyContent" runat="server"  ContentPlaceHolderID="ContentPlaceHolder">
    <table width="100%" align="center" cellpadding="2" cellspacing="2" border="0" bgcolor="#EAEAEA" >
        <tr align="left" style="background-color:#004080;color:White;" >
            <td> ID </td>                        
            <td> Name </td>            
            <td>Pass</td>                        
        </tr>

        **<%--Need the while output into here--%>**

    </table>
</asp:Content>

Answer 1

Basically use the classic ASP\\PHP\\Spaghetti code approach.

First of all, place your code in one public method that returns a string . The method:

public string getWhileLoopData()
{
        string htmlStr = "";
        SqlConnection thisConnection = new SqlConnection(dbConnection);
        SqlCommand thisCommand = thisConnection.CreateCommand();
        thisCommand.CommandText = "SELECT * from Test";
        thisConnection.Open();
        SqlDataReader reader = thisCommand.ExecuteReader();

        while (reader.Read())
        {
            int id = reader.GetInt32(0);
            string Name = reader.GetString(1);
            string Pass = reader.GetString(2);
            htmlStr +="<tr><td>"+id+"</td><td>"+Name+"</td><td>"+Pass+"</td></tr>"                   
        }

        thisConnection.Close();
        return htmlStr;
}

Then you can use the <%=getWhileLoopData()%> tag in ASP.NET that is equal to <%Response.Write(getWhileData())%>

It should look something like this:

<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/test.master" CodeFile="test.aspx.cs" Inherits="test" %>

<asp:Content ID="BodyContent" runat="server"  ContentPlaceHolderID="ContentPlaceHolder">
    <table width="100%" align="center" cellpadding="2" cellspacing="2" border="0" bgcolor="#EAEAEA" >
        <tr align="left" style="background-color:#004080;color:White;" >
            <td> ID </td>                        
            <td> Name </td>            
            <td>Pass</td>                        
        </tr>

        <%=getWhileLoopData()%>

    </table>
</asp:Content>

There is also the option to use an repeater control and bind the data from your DB to an Item Template of your liking.

Answer 2

I suggest you to use repeater control and create your html table structure in repeater.

<table cellpadding="0" cellspacing="0" width="100%">
<asp:Repeater ID="rpt" runat="server" >
<HeaderTemplate>
<tr class="Header">
<td>
ID
</td>
<td>
Name
</td>
<td>
Pass
</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<%# Eval("ID")%>
</td>
<td>
<%# Eval("Name")%>
</td>
<td>
<%# Eval("Pass")%>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>

bind repeater as same as you bind gridview

thanks

Answer 3

If you put the runat="server" attribute on your HTML table, you can actually programmatically access it in your code-behind. It's quite a powerful feature.

It's definitely not the best solution, but it's a very cool feature no one knows about.

Answer 4

add 3 literal controls to your asp page put them in the tr below the title td s, and then:

while (reader.Read())
    {
        int id = reader.GetInt32(0);
        string Name = reader.GetString(1);
        string Pass = reader.GetString(2);  
        literalID.text += id.ToString();
        literalName.text += Name.ToString();
        literalPass.text += Pass.ToString();
    }

this is the easiest solution I know, but it's not neat.
here's the html code:

<tr align="left" style="background-color:#004080;color:White;" >
    <td> ID </td>                        
    <td> Name </td>            
    <td>Pass</td>                        
</tr>
<tr align="left" style="background-color:#004080;color:White;" >
    <td><asp:Literal ID="literalID" runat="server"></asp:Literal></td>                        
    <td><asp:Literal ID="literalName" runat="server"></asp:Literal></td>            
    <td><asp:Literal ID="literalPass" runat="server"></asp:Literal></td>   
</tr>

Answer 5

In this solution , all HTML tags create in client Side and client have to render this processes instead of server. this is a better idea and give best performance for your server then use this code:

<asp:Content ID="BodyContent" runat="server" 
 ContentPlaceHolderID="ContentPlaceHolder">
     <table width="100%" align="center" cellpadding="2" cellspacing="2" border="0" bgcolor="#EAEAEA" >
         <tr align="left" style="background-color:#004080;color:White;" >
             <td> ID </td>                        
             <td> Name </td>            
            <td>Pass</td>                        
         </tr>

       <% if(dt != null && dt.rows.count>0){
              foreach(var item in dt.rows)
                 {%>
                   <tr>
                      <td><%=item["ID"]%></td>
                      <td><%=item["Name"]%></td>
                      <td><%=item["Pass"]%></td>
                   </tr>
                  <%}
                }%>

     </table> </asp:Content>