Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to generate unordered list dynamically in asp.net?

I want to generate a unordered list which contains tag for showing images in my database, I take a look at bulleted list, but it is not working with image. How can i dynamically generate it from the results in a database, for eg, if i have 6 images in data base then i want the list which generates must look like this.

<ul id="">

    <li><img src="Resources/img14.jpg" alt="" title=""/></li>

    <li><img src="Resources/img15.jpg" alt="" title=""/></li>

    <li><img src="Resources/img17.jpg" alt="" title=""/></li>

    <li><img src="Resources/img2.jpg" alt="" title=""/></li>

    <li><img src="Resources/img5.jpg" alt="" title=""/></li>

    <li><img src="Resources/img3.jpg" alt="" title=""/></li>

</ul>

Table Structure

User Name   nvarchar(50)    
Pic Path    nvarchar(MAX)
like image 253
Jelo Melo Avatar asked May 14 '12 07:05

Jelo Melo


2 Answers

For what you are trying to achieve, it would be best and easiest just to use a <asp:ListView> control.

There is a good tutorial here on how to use it, and pretty much similar to what you are doing http://weblogs.asp.net/scottgu/archive/2007/08/10/the-asp-listview-control-part-1-building-a-product-listing-page-with-clean-css-ui.aspx

It would basically involve you creating a <asp:ListView> control like;

<asp:ListView ID="ListView1" runat="server">
    <LayoutTemplate>
        <ul>
            <asp:PlaceHolder ID="itemPlaceholder" runat="server" />    
        </ul>                
    </LayoutTemplate>
    <ItemTemplate>
        <li>
             <img src='<%#Eval("PicPath")%>' alt='<%#Eval("UserName")%>' />
        </li>
    </ItemTemplate>
    <EmptyDataTemplate>
        <p>Nothing here.</p>
    </EmptyDataTemplate>
</asp:ListView>

Then binding your data to it.

this.ListView1.DataSource = YourDataSource;
this.ListView1.DataBind();
like image 176
Tim B James Avatar answered Nov 04 '22 02:11

Tim B James


I suppose your datasource is a DataSet ds that has one DataTable and a field picpath, then you can write the iteration directly in aspx

<ul id="">
    <% foreach (DataRow dr in ds.Tables[0].Rows) { %>

        <li><img src="<% dr[\"picpath\"].ToString() %>" alt="" title=""/></li>

    <% } %>
</ul>

To do it server side see the accepted answer in below link see the accepted answer in the following link Rendering an unordered list using asp.net

like image 39
Imran Rizvi Avatar answered Nov 04 '22 01:11

Imran Rizvi