I am making a comment box for my webpage, I have designed the form to take the user Name and comments and store it in the database table. I don't know how to render that data on the page. Either by iterating on the table and subsequently creating paragraph on the page or by creating labels on the page.
I am using LINQ to SQL in C#. Please tell me how to render the comments in database on web page or some link to tutorial
let's assume you have a CommentsTable having columns:
and your LinqToSql data context is myDataContext thn you can do this:
myDataContext db = new myDataContext();
var commentsData = db.CommentsTable.ToList();
string html=string.Empty;
foreach(var item in commentsData)
{
html+="<div class='property-row'><div class='username'>"+item.Username+"</div>";
html+="<div class='notice'>"+item.DateCreated.ToString("mm-dd-yyyy hh:mm")+"</div>"
html+="<div class='comment'>"+item.Comment+"</div>";
}
Div1.InnerHtml= html;
now you can control look of your sections i.e. username row and the comments beneath it by suitably decorating the classes on the designer i.e.
.property-row
{
position:relative;
width:100%;
background-color:#CCCCCC;
border:1px solid Black;
}
.username
{
position:relative:
padding:2px;
top:2px;
font-size:0.8em;
color:#333333;
text-decoration:underline;
}
.comment
{
position:relative;
padding:2px;
margin:2px;
font-size:1em;
color:black;
}
.notice
{
font-size:0.7em;
}
I recommend you learn about and how to use data controls which are designed to be used in cases where multiple rows can be returned and data is repeated in the same format, such as yours now (comments). Example controls:
GridViewListViewRepeaterGoing into detail about each control here will not answer your question, but is important; it's something you can research easily online anyway.
For this case, I recommend you use a ListView:
ListView to your page - where you would like your comment box to beItemTemplate tag inside the ListView to layout what format each individual comment will follow (so you would you a paragraph <p> tag around the comment. Where a column would be binded (e.g. actual comment), you use the code: <%# Eval("ColumnName") %>
Just to make it clear, the code above runs at the server because it is an inline server tag: code in your .aspx file which is run by the server. This code is denoted by the percentage symbols at the beginning at end of the tag <% %>, which is highlighted in yellow by VS (Visual Studio). There are different types of inline server tags, shown by the first symbol. In this case, the hash # is used, which means the code in the tag is a binding expression. Meaning with all the data controls mentioned above, you will use this symbol to bind data with inline server tags.
For example (use a more semantic layout on your ItemTemplate, though):
<asp:ListView ID="LV_Comments" runat="server">
<ItemTemplate>
<b><%# Eval("Username") %></b>
<br />
<i><%# Eval("WhenPosted") %></i>
<p><%# Eval("Comment") %></p>
</ItemTemplate>
</asp:ListView>
DataSource to your Comments table with L2S (LINQ to SQL). I recommend you create a method to do this and call the method on the Page_Load event. And call the method after adding a new comment to, as you would only bind the data if there is not a postback by default (see below).Setting the DataSource example:
using (var db = new DataContext())
{
LV_Comments.DataSource = from x in db.DT_Comments select new {
Username = x.Name,
x.Comment,
WhenPosted = x.PostTime
};
LV_Comments.DataBind();
}
You will need to change the names of the columns and DataContext obviously. Note where I have declared SomeName = x.ColumnName, I am just changing what I refer to the column name by in the ListView (this code: <%# Eval("SomeName") %>); you don't have to do it, like you can see I haven't with the Comment column.
How to use this code with a method and your events:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
ListViewMethod();
}
private void ListViewMethod()
{
// ListView data binding code here
}
protected void NewCommentButton_Click(object sender, EventArgs e)
{
// Your code to add new comment
ListViewMethod();
}
Remember to find out more about when and how to use more features of these datacontrols. Like if you had no comments, you might want to tell the user this. So you would use an EmptyItemTemplate inside your ListView tag (but outside your ItemTemplate), like so:
<EmptyItemTemplate>
<i>No comments have been posted</i>
</EmptyItemTemplate>
using HtmlGenericControl you can do that. See the example below
using System.Web.UI.HtmlControls;// add this namespace
HtmlGenericControl MyPtag = new HtmlGenericControl("p");
MyPtag.InnerText = "Your content inside P Tag";
Placeholder1.Controls.Add(MyPtag);
You must add this to a placeholder as shown above,Placeholder1.
