ASP.NET Forums Website Part 2 Adding the Home Page

ASP.NET Forums Website Part 2 Adding the Home Page

Adding the Default.aspx Page 
The next thing we need to do is create our home page. This page will simply display links to all of the topics in our forum and also have some data about the last post in each topic. To do this, we will be pulling all of the topics from the Topics table in our database and displaying them with a repeater. However, we do not currently have any data in our Topics table, so we will need to add in some topics. To do this, right click the Topics table and select Show Table Data. Under the Topic Name column, add in the following topics: General Discussion, ASP.NET Discussion, and C# Discussion. 
 
Once that is setup, we can now pull these topics from the database and display them in a repeater in our Default.aspx Web Form. To do this:

1. Right click the project in your Solution Explorer.
2. Select Add New Item…
3. Select a Web Form and name it Default.aspx.
4. Ensure that the Select master page checkbox is checked and click Add.
5. Select MasterPage.master we added earlier and click OK.

We migrated our web sites to Server Intellect over one weekend and the setup was so smooth that we were up and running right away. They assisted us with everything we needed to do for all of our applications. With Server Intellect’s help, we were able to avoid any headaches!

If you open Default.aspx up to design view you should see the Master Page content grayed out and an ASP.NET Content section labeled ContentPlaceHolder1. Here is where we will add our repeater, to do this:

1. Expand the Data tab in your toolbox.
2. Drag and drop a Repeater into the ContentPlaceHolder1 on the Web Form.
3. Expand the Repeater Tasks Menu.
4. In the Choose Data Source DropDownList, select <New Data Source…>. 
   
5. In the Data Source Configuration Wizard, select a Sql Database and click OK.
6. It will now prompt you to choose your data connection, in the DropDownList select the ForumDB.mdf database we added earlier and click Next.
7. Choose yes to save the connection string and name it ForumDBConnectionString and hit Next.
8. Next, we need to configure the Select Statement. To do this, select the Topics table from the Name DropDownList and click Next. 
   
9. Test the query to make sure you get the correct columns, TopicId, TopicName, LastPostTitle, LastPostUserName, and LastPostDateTime.
10. Click Finish.

Need help with Windows Dedicated Hosting? Try Server Intellect. I’m a happy customer!

Now that we have a repeater with a connection to our Topics table in our ForumDB database, we need to format it to output our topics in a table. To do this, open up Default.aspx to Source mode and:

1. In the Repeater tags, add the following code for the header:
   Code Block

   Ask a Question

   Download Source

   Default.aspx

   The header.

   <HeaderTemplate>
       <table border="1" width="800px" cellpadding="5px">
       <tr>
           <td>
               Topic:
           </td>
           <td>
               Last Post:
           </td>
           <td>
               By:
           </td>
           <td>
               Time:
           </td>
       </tr>
   </HeaderTemplate>
2. Under the Header Template tag, add in the following code for the items:
   Code Block

   Ask a Question

   Download Source

   Default.aspx

   The items.

   <ItemTemplate>
       <tr>
           <td>
               <a href="Topic.aspx?id=<%# Eval("TopicId") %>"><%# Eval("TopicName") %></a>
           </td>
           <td>
               <%# Eval("LastPostTitle") %>
           </td>
           <td>
               <%# Eval("LastPostUserName") %>
           </td>
           <td>
               <%# Eval("LastPostDateTime") %>
           </td>
       </tr> 
   </ItemTemplate>
3. Under the Item Template tag, add in the following code for the footer:
   Code Block

   Ask a Question

   Download Source

   Default.aspx

   The footer.

   <FooterTemplate>
       </table>
   </FooterTemplate>

What this has done, is setup a table with a header that labels four columns, Topic, Last Post, By, and Time. Then, we add to the ItemTemplate four columns for each topic that displays the corresponding data from our Topics table, while linking the TopicName to a Topic.aspx page and passing the TopicId as a query string. Finally, we end the table tag in the FooterTemplate of the table.

At this point, we can test to make sure that our home page is displaying our topics by loading up our Default.aspx page. You should see something similar to this: 
 
If you’re looking for a really good web host, try Server Intellect – we found the setup procedure and control panel, very easy to adapt to and their IT team is awesome!That is pretty much it for the Home page, next we need to add the Topic page that our topics link to. 
ASPdotNET-Forums-Website-Tut.zip