Using ASP.Net, what would be the best control to use in this situation?

Question

I'm writing a small program that lets the user enter a keyword. The program then searches through a database table and finds all records (using LINQ) that match the user's search criteria.

The resulting records that are returned will be displayed on the screen as images (much like Googles image search page). The user will then be able to click on any of the returned images and be taken to a page with more detail about that image.

My question is, what is the best control to use to display the images that result from the user's initial search? This is an ASP.Net program. Would it be better to show the images in a gridview? Or a listview? Or build a table and fill each cell with an image button? I've never done this before so I'm basically just wondering how to present the data.

I'm not looking for code but I'd love to hear how you'd handle this.

Thanks!

EDIT:

I should add that all the images are the same size and I'm thinking that I'd return all images and let the user scroll down the page. Realistically, I don't think there would ever be more than 50 images for the user to choose from. I'm envisioning having five images on each row of results returned, like the below image:

Answer 1

I've always been a fan of keeping things simple by using a Repeater where I can. You'll have more control over how things will look writing for own HTML.

Since you're using images, and I assume they will be in different sizes, I'd make the Itemtemplate contain a div with an anchor and img inside of it. Slap a max width onto the images and hide the overflow on the div so the images don't look scrunched.

Just set the datasource property of what's returned from the filter, call a databind() and you're good to go.

That's how I'd approach this situation. I too am interested in hearing from others for comparison.

Answer 2

I'd go for the trusty Repeater control. That gives you the flexibility to render whatever you want for any collection.

Answer 3

I would create a control that builds a dynamic table control . You could have a List<string> to hold the url of each image. I would expose a public method called AddImage(string imageUrl) that would add the url to the List<string> collection.

Once the page is ready to be rendered, I would divide the number of images you have by 5 (this will give you the number of rows you need) and then just render the table. In addition, before rendering, you could use LINQ to get the data before render (for example, to sort it)