When displaying the document using the transformation the advanced data are available for you to help you enhance the way content is displayed. Take a look on how to use those.
Let's take a look on advanced item information available for you when displaying the document content using transformations.

Go to the 'Site Manager-> Development-> Document types-> -> Edit-> Transformations-> -> Edit'. Click the 'Click here to view list of transformations examples. ' link at the bottom of the transformation editing UI.

1_List_of_examples-(1).png


It brings up the screen with various examples on items available for you to be used in transformation. In this article we're going to talk about items from the 'Data' section.

2_List_data_items.png

The 'DataItem' is the same object you get when handling the 'ItemDataBound' event of the repeater control.

The 'DataItemIndex' represents the index of the item in the data set. If you get 10 items in the data set they'd be indexed from 0 to 9.

The 'DataRowView' is the view of the row holding the current item's data.

The 'DisplayIndex' is the index of the item on the currently displayed page. It means if the page contains up to 5 items this index will always be 0 to 4. Note the 'DataItemIndex' might be different for the current item though.

Let's give you an example on how to use the 'DisplayIndex' for example.

Display index

Imagine you're displaying the content using the repeater web part. You enabled paging to include 3 items per page. Page should give a different styling to the first and third item displayed. You therefore need to somehow flag such item to be able to style it through the CSS styles. Taking the advantage of what is available for you among the 'Data' items you just need to modify the transformation as pictured below.

3_Using_DataItemIndex.png

You've wrapped the content rendered for each item with the DIV element, specifying the class name including the dynamically resolved index information. In site's CSS style sheet you define style for the 'NewsItem_0' and 'NewsItem_2' classes. When you set a background color for items and navigate to the live site the result could look like the following.

3_Using_DataItemIndex_Live.png

You can review the source code of the outputted page to check whether the news items get class names rendered as expected.

NOTE: You might want to take a look on all the members of the 'CMS.Controls.CMSAbstractTransformation' class as all of them are available for you in the transformation. You can simply access them using the '<%# ... %>' directive in the transformation text.
 

-kj-


See also:


Applies to: 4.x, 5.x
Created on 6/20/2010 9:33:48 AM in Content Management
 
0 ratings
Sitemap | Content Management System | E-commerce Software | Social Networking Software | Intranet | Online Marketing Solution | Copyright © 2004-2013 Kentico Software | Powered by Kentico CMS