Unlike grids, repeater is known to be a quick and easy way to repeat chunks of HTML based on the data stored in the collection of your objects.
You don’t get all the paging functionality with it but often times you don’t need any.
For example, if you’re creating a custom “search results” page that displays different results but with the same extra markup surrounding the result. In SharePoint, the easiest way to create something like this, is to create an object and a collection that will store your data … then drop a repeater in to a Visual web part and bind your object collection to that repeater.
The great thing about this is that user experience developers can add their markup within a repeater and visually preview what’s going on before you even wire the data source. Also, when you’re ready to wire the data source, you just replace the values hard coded by your UE developers with <%# Eval(“Field1″) %> keywords and there you go.
One of the biggest problems with this approach is that:
You can’t refresh the repeater on the client; so you have to refresh your page every time you’re performing some sort of manipulation on the data and want an instant preview of that data for the user. In fact, if you look at the source behind the page which renders a repeater, there is not extra markup that stands for your repeater. That’s right, your repeater doesn’t even render a DIV for itself – it just repeats the markup for each item straight on the page.
What you might consider instead of coding a repeater in your visual web part is to create:
1. Create an application page which will implement your repeating logic:
The repeating logic doesn’t have to be anything complex, in fact you can just put a literal control in to the page and construct your HTML in a loop in code behind
<asp:Literal id="SearchResultsContent" runat="server" />
If you have a bit more complex markup and you don’t want your UE developers to go in your code behind and accidentally break things, you can export that markup into a resource file like this:
This is just a simple HTML file representing a single item. In your loop, you will replace predefined string keywords with actual values dynamically.
2. On your client you will then call this page and inject it’s results to the DIV of your choice effectively refreshing your repeating content on the client without a refresh:
function SearchFeed(keyword, items) {
$.get('/_layouts/MyProject/SearchResults.aspx?k=' + keyword + '&items=' + items, function (data) {
$('.my-content-main').html(data);
if ($(data).length <= 1) {
$('.shp-content-main').html("<div class='show-more'><span class='shp-show'>Nothing found matching your query</span></div>");
}
});
}
That's it really; now your application page drives the functionality which is being consumed in the web part on the client.
Enjoy!
