Dynamic HTML in ASP.NET

[Colin]

Hello,

I can manage quite well in ASP but would like some
advice in the best way to achieve dynamic layout
in ASP.NET and still keep the page and code
separate.

Let's say I already have a data source which
contains a few records with a picture link and
a label. That's simple so far but now I would
like to display all the records in a table with
three items in a row, each item maybe in a
bordered cell with picture, label and a checkbox
for selection.

Now the question is what is the most efficient
way of laying this out. I have had a look at the
Repeater control but this will not do as I need
to add the checkboxes programmatically
depending on the item count.

So it seems that I could use a Placeholder control,
loop through my items and add all the table html
using Literal controls. Is this the best way of
doing this, or am I missing something completely?

Any advice will be much appreciated.

 

[Edwin Knoppert]

Easiest is making use of the gridview control and then modify a cell to
become itemtemplate
The Bind() or Eval() can then be used in the SOURCE to obtain the
fielddata..

 

[Kevin Spencer]

Now the question is what is the most efficient

way of laying this out. I have had a look at the
Repeater control but this will not do as I need
to add the checkboxes programmatically
depending on the item count.

You can certainly do this with a Repeater, using Databinding expressions.

I'm still not sure what this has to do with keeping "page and code separate"
however. That is another issue altogether.

--
HTH,

Kevin Spencer
Microsoft MVP
Professional Chicken Salad Alchemist

Big thicks are made up of lots of little thins.

 

[Vadivel Kumar]

I guess, Repeater control seems to be appropriate comparing to
PlaceHolder control. Because, you can very easily iterate thru the Data.

Lets see how it is easy. For example, I have the following aspx code

<asp:Repeater Id="repeater1" runat="server">
<ItemTemplate>
<asp:CheckBox Id="checkBox1" runat="server"></asp:CheckBox>
<asp:Image Id="image1" runat="server" />
</ItemTemplate>
</asp:Repeater>

Now, In the Page_Load Event I am binding the data to this control.

if (!IsPostBack)
{
//table is a DataTable object which the data needed to be populated
repeater1.DataSource = table;
repeater1.DataBind();
}

Once the data is binded, ASP.NET will call ItemDataBound event while
binding the data to the repeater control. I guess, you know how to
create ItemDataBound event for the repeater control.

Inside the ItemDataBound event,

void repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
{

DataRow row = e.Item.DataItem as DataRow;

Image image1 = e.Item.FindControl("image1");
image1.ImageUrl = row["image"];
}


Now if you look at the code, you can easily understand how I am binding
the data to the Image control. This ItemDataBound will be called for
each and every row present in the table and binds the image column's
data to the ImageUrl property of image1 control.

Let me know in case you need further clarification.

-
Vadivel Kumar
http://vadivelk.net