RadDataPager issue

[El]

The pager appears fine in all browsers (Opera, Google Chrome, Firefox and Safari) except in Internet Explorer where it's displayed very strange e.g. next/prev buttons are invisible without background etc. etc.

Is it known bug or i am missing something. This is the code:

<telerik:RadListView ID="RadListView1" runat="server"
            ItemPlaceholderID="itemPlaceholder" GroupPlaceholderID="groupPlaceholder" DataKeyNames="product_ID"
            onneeddatasource="RadListView1_NeedDataSource" AllowPaging="true" GroupItemCount="3"
            AllowCustomPaging="true" Skin="Telerik">

            <LayoutTemplate>
                    <table  cellpadding="0" cellspacing="0" width="97%" style="clear: both; margin-top: 10px; margin-bottom: 10px;">
                        <tr>
                            <td align="center">
                                <telerik:RadDataPager ID="RadDataPager2" runat="server" PagedControlID="RadListView1"
                                    PageSize="30" Skin="Telerik">
                                    <Fields>
                                        <telerik:RadDataPagerButtonField FieldType="FirstPrev" />
                                        <telerik:RadDataPagerButtonField FieldType="Numeric" />
                                        <telerik:RadDataPagerButtonField FieldType="NextLast" />

                                        <telerik:RadDataPagerTemplatePageField>
                                            <PagerTemplate>
                                                <div style="float: right">
                                                    <b>Items
                                                        <asp:Label runat="server" ID="CurrentPageLabel" Text="<%# Container.Owner.StartRowIndex+1%>" />
                                                        to
                                                        <asp:Label runat="server" ID="TotalPagesLabel" Text="<%# IIF(Container.Owner.TotalRowCount > (Container.Owner.StartRowIndex+Container.Owner.PageSize), Container.Owner.StartRowIndex+Container.Owner.PageSize, Container.Owner.TotalRowCount) %>" />
                                                        of
                                                        <asp:Label runat="server" ID="TotalItemsLabel" Text="<%# Container.Owner.TotalRowCount%>" />
                                                        <br />
                                                    </b>
                                                </div>
                                            </PagerTemplate>
                                        </telerik:RadDataPagerTemplatePageField>
                                    </Fields>
                                </telerik:RadDataPager>
                            </td>
                        </tr>
                    </table>

            <table cellpadding="0" cellspacing="0" width="100%" style="padding-left: 40px;">
                <asp:PlaceHolder ID="groupPlaceholder" runat="server" />
            </table>

                    <table  cellpadding="0" cellspacing="0" width="95%" style="clear: both; margin-top: 10px;">
                        <tr>
                            <td align="center">
                                <telerik:RadDataPager ID="RadDataPager1" runat="server" PagedControlID="RadListView1"
                                    PageSize="30" Skin="Telerik">
                                    <Fields>
                                        <telerik:RadDataPagerButtonField FieldType="FirstPrev" />
                                        <telerik:RadDataPagerButtonField FieldType="Numeric" />
                                        <telerik:RadDataPagerButtonField FieldType="NextLast" />

                                        <telerik:RadDataPagerTemplatePageField>
                                            <PagerTemplate>
                                                <div style="float: right">
                                                    <b>Items
                                                        <asp:Label runat="server" ID="CurrentPageLabel" Text="<%# Container.Owner.StartRowIndex+1%>" />
                                                        to
                                                        <asp:Label runat="server" ID="TotalPagesLabel" Text="<%# IIF(Container.Owner.TotalRowCount > (Container.Owner.StartRowIndex+Container.Owner.PageSize), Container.Owner.StartRowIndex+Container.Owner.PageSize, Container.Owner.TotalRowCount) %>" />
                                                        of
                                                        <asp:Label runat="server" ID="TotalItemsLabel" Text="<%# Container.Owner.TotalRowCount%>" />
                                                        <br />
                                                    </b>
                                                </div>
                                            </PagerTemplate>
                                        </telerik:RadDataPagerTemplatePageField>
                                    </Fields>
                                </telerik:RadDataPager>
                            </td>
                        </tr>
                    </table>
            </LayoutTemplate>

            <GroupTemplate>
                <tr>
                    <asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder>
                </tr>
            </GroupTemplate>
            <ItemTemplate>
               <td valign="top" style="padding-bottom: 10px;">
            <div>
            <table cellpadding="0" cellspacing="0">
                <tr>
                    <td valign="top" align="center">
                        <div class="ItemTitle">
                            <a href="Details.aspx?id=<%# Eval("product_ID") %>">
                                <asp:Label ID="lblTitle" runat="server" Text='<%# ShortenText.Shorten(Eval("title"), 15) %>'></asp:Label>
                            </a>
                        </div>
                    </td>
                </tr>

                <tr>
                    <td valign="middle" align="center">
                        <a href="Details.aspx?id=<%# Eval("product_ID") %>">
                            <asp:Image id="imgThumbnail" runat="server"  />
                        </a>
                    </td>
                </tr>
        </table>
            </div>
            </td>
            </ItemTemplate>
        </telerik:RadListView>

[El]

This is how it looks in FF and Other Browsers
http://img245.imageshack.us/i/properly.gif/


This is how it looks in Internet Explorer :(
http://img193.imageshack.us/i/buggy.gif/

[El]

Anybody sees this post? BUMP BUMP

[Radoslav]

Hi El,

It is hard to say what is causing the described issue without having the running application and reproduce the issue. Could you please send us a simple runnable example which demonstrating the unwanted behavior. You could open a formal support ticket from your Telerik account and attach a ZIP file there. Thus we will be able to gather more details about your scenario and provide you a solution.

Kind regards,
Radoslav
the Telerik team

[El]

I just found what is causing this odd issue :(

Namely, as long as you have less than 26 .css files inside the applied theme folder it works good. Once you exceed the files number of 26 it starts to behave like described in IE but still works fine in Firefox and other browsers. Could you please find out how it's related with the number of theme style files?

Thanks

[Sebastian]

Hi El,

I suppose the information from this blog post can help.

Regards,
Sebastian
the Telerik team

[Grace DS]

Try this...

<PagerTemplate>
<div style="float: right;">
  <b>Items
  <asp:Label runat="server" ID="CurrentPageLabel" Text="<%# Container.Owner.StartRowIndex+1%>" />
  to
  <asp:Label runat="server" ID="TotalPagesLabel" Text="<%# IIF(Container.Owner.TotalRowCount >(Container.Owner.StartRowIndex+Container.Owner.PageSize), Container.Owner.StartRowIndex+Container.Owner.PageSize, Container.Owner.TotalRowCount) %>" />
  of
  <asp:Label runat="server" ID="TotalItemsLabel" Text="<%# Container.Owner.TotalRowCount%>" />
   <br />
   </b>
</div>
<div style="clear:both;"></div>
</PagerTemplate>