It’s irritating to try and do something that you’ve done before, but can’t find how to do it and you have to look up how to do it again. Here’s my example of a ComponentArt Grid with a slider
<componentart:grid
id="grid1" AllowMultipleSelect="false"
RunningMode="Client" CssClass="Grid"
ShowHeader="false"
SearchTextCssClass="GridHeaderText"
HeaderCssClass="GridHeader"
FooterCssClass="GridFooter"
GroupByCssClass="GroupByCell"
GroupByTextCssClass="GroupByText"
PageSize="15"
GroupingPageSize="5"
PreExpandOnGroup="true"
ImagesBaseUrl="../images/"
TreeLineImagesFolderUrl="~/images/lines/"
TreeLineImageWidth="22"
TreeLineImageHeight="19"
IndentCellWidth="22"
GroupingNotificationTextCssClass="GridHeaderText"
GroupBySortAscendingImageUrl="group_asc.gif"
GroupBySortDescendingImageUrl="group_desc.gif"
GroupBySortImageWidth="10"
GroupBySortImageHeight="10"
width="600px"
PagerStyle="Slider"
PagerTextCssClass="GridFooterText"
PagerButtonWidth="44"
PagerButtonHeight="26"
PagerButtonHoverEnabled="true"
SliderHeight="26"
SliderWidth="150"
SliderGripWidth="9"
SliderPopupOffsetX="80"
SliderPopupClientTemplateId="SliderTemplate"
SliderPopupCachedClientTemplateId="CachedSliderTemplate"
PagerImagesFolderUrl="~/images/pager/"
runat="server">
<Levels>
<ComponentArt:GridLevel
DataKeyField="itemnmbr"
ShowTableHeading="false"
ShowSelectorCells="false"
ColumnReorderIndicatorImageUrl="reorder.gif"
AllowGrouping="false"
SortAscendingImageUrl="asc.gif"
SortDescendingImageUrl="desc.gif"
SortImageWidth="10"
SelectorCellWidth="18"
SelectorImageUrl="selector.gif"
SelectorImageWidth="17"
SelectorImageHeight="15"
EditCellCssClass="EditDataCell"
EditFieldCssClass="EditDataField"
EditCommandClientTemplateId="EditCommandTemplate"
RowCssClass="Row"
DataCellCssClass="DataCell"
HeadingCellCssClass="HeadingCell"
HeadingCellHoverCssClass="HeadingCellHover"
HeadingCellActiveCssClass="HeadingCellActive"
HeadingRowCssClass="HeadingRow"
HeadingTextCssClass="HeadingCellText"
SelectedRowCssClass="SelectedRow"
GroupHeadingCssClass="GroupHeading"
SortImageHeight="19">
<Columns>
<ComponentArt:GridColumn DataField="itemnmbr" AllowEditing="False" HeadingText="Item Number" />
<ComponentArt:GridColumn DataField="itemCount" AllowEditing="False" HeadingText="Item Count" />
<ComponentArt:GridColumn DataField="SFHoldsCount" AllowEditing="False" HeadingText="SF Holds count" />
<ComponentArt:GridColumn DataCellServerTemplateId="LinkButtonTemplate" />
</Columns>
</ComponentArt:GridLevel>
</Levels>
<ClientTemplates>
<ComponentArt:ClientTemplate ID="ClientTemplate1" >
<table class="SliderPopup" width="300px" style="background-color: #fffacd" cellspacing="10"
cellpadding="0" border="0">
<tr>
<td>
<nobr style="overflow:hidden;width:250px;">## DataItem.GetMember('itemnmbr').Value ##</div>
</td>
</tr>
<tr>
<td valign="middle" align="center">
Page <b>## DataItem.PageIndex + 1 ##</b> of <b>## gridex1.PageCount ##</b>
</td>
</tr>
</table>
</ComponentArt:ClientTemplate>
</ClientTemplates>
<ServerTemplates>
<ComponentArt:GridServerTemplate Id="GridServerTemplate1">
<template>
<asp:LinkButton ID="lbtnEdit" Runat="server" text="Edit" Visible='true' CommandName="edit" CommandArgument='<%# Container.DataItem("itemnmbr") %>' />
</template>
</ComponentArt:GridServerTemplate>
</ServerTemplates>
</componentart:grid>