This is a migrated thread and some comments may be shown as answers.

RadlistView and RaddataPager

17 Answers 239 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

17 Answers, 1 is accepted

answered on 08 Oct 2010, 09:03 AM

Hello Ronak,

The most straight-forward solution would be to utilize our RadFilter and RadDataPager controls to implement filtering and paging for your RadListView instance. See the online demos listed below for further details:

http://demos.telerik.com/aspnet-ajax/filter/examples/firstlook/defaultcs.aspx?product=listview
http://demos.telerik.com/aspnet-ajax/listview/examples/paging/raddatapager/defaultcs.aspx

Alternatively, you can rely on the built-in paging and filtering mechanism of the listview control as illustrated on these examples:

http://demos.telerik.com/aspnet-ajax/listview/examples/filtering/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/listview/examples/paging/integratedpaging/defaultcs.aspx

Best regards,
Sebastian
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

answered on 08 Oct 2010, 05:11 PM

Thanks but in my case even integrated paging is not working i am attaching code here for review am i missing something ?

%@ Assembly Name="$SharePoint.Project.AssemblyFullName$" %>

<%@ Assembly Name="Microsoft.Web.CommandUI, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 

<%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 

<%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

<%@ Register Tagprefix="asp" Namespace="System.Web.UI" Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>

<%@ Import Namespace="Microsoft.SharePoint" %> 

<%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

<%@ Register TagPrefix="Telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI, Version=2010.2.929.35, Culture=neutral, PublicKeyToken=121fae78165ba3d4" %>

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="EventsRollupUserControl.ascx.cs" Inherits="CAS.EventsRollup.EventsRollup.EventsRollupUserControl" %>

<

div id="Events">

<Telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<Telerik:AjaxSetting AjaxControlID="ListViewPanel1" >

<UpdatedControls>

<Telerik:AjaxUpdatedControl ControlID="ListViewPanel1" LoadingPanelID="RadAjaxLoadingPanel1" />

</UpdatedControls>

</Telerik:AjaxSetting>

</AjaxSettings>

</Telerik:RadAjaxManager>

<Telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />

<asp:Panel ID="ListViewPanel1" runat="server">

<Telerik:RadListView ID="eventsRollup" DataKeyNames="ID" AllowPaging="true" PageSize="5" ItemPlaceholderID="EventsContainer" runat="server">

<LayoutTemplate>

<fieldset>

<legend>Events</legend>

<asp:PlaceHolder ID="EventsContainer" runat="server" />

<div>

<div style="float: left; margin-left: 30%;">

<asp:Button runat="server" ID="btnFirst" CommandName="Page" CommandArgument="First" Text="First" Enabled="<%#Container.CurrentPageIndex > 0 %>" />

<asp:Button runat="server" ID="btnPrev" CommandName="Page" CommandArgument="Prev" Text="Prev" Enabled="<%#Container.CurrentPageIndex > 0 %>" />

<span style="vertical-align: top; position: relative; top: 4px">Page <%#Container.CurrentPageIndex + 1 %> of <%#Container.PageCount %></span>

<asp:Button runat="server" ID="btnNext" CommandName="Page" CommandArgument="Next" Text="Next" Enabled="<%#Container.CurrentPageIndex + 1 < Container.PageCount %>" />

<asp:Button runat="server" ID="btnLast" CommandName="Page" CommandArgument="Last" Text="Last" Enabled="<%#Container.CurrentPageIndex + 1 < Container.PageCount %>" />

</div>

<div>

<span style="vertical-align: middle; font-weight: bold; padding-left: 5px;">Page Size:</span>

<Telerik:RadComboBox runat="server" ID="cmbPageSize" OnSelectedIndexChanged="cmbPageSize_SelectedIndexChanged" AutoPostBack="true" Width="40px" SelectedValue="<%#Container.PageSize %>">

<Items>

<Telerik:RadComboBoxItem Text="5" Value="5" />

<Telerik:RadComboBoxItem Text="10" Value="10" />

<Telerik:RadComboBoxItem Text="15" Value="15" />

</Items>

</Telerik:RadComboBox>

</div>

</fieldset>

</LayoutTemplate>

<ItemTemplate>

<div class="news-items">

<div class="image-area-left">

<asp:Image ID="eventImg" ImageUrl='<%# Eval("ImageUrl")%>' runat="server" Visible='<%# Eval("Visible")%>' Width="122px" Height="95px" />

</div>

<div class="news-item">

<a href='<%# Eval("PageUrl")%>' title='<%# Eval("Title")%>' ><%# Eval("Title")%></a>

<p><%# Eval("EventDate")%></p>

<p><%# Eval("Location")%></p>

<div class="news-excerpt"><%# Eval("Excerpt")%></div>

</div>

</ItemTemplate>

<ItemSeparatorTemplate>

<div><hr /></div>

</ItemSeparatorTemplate>

<EmptyDataTemplate>

<fieldset>

<legend>Events</legend>

<div style="margin:5px;">There are no Upcoming Events</div>

</fieldset>

</EmptyDataTemplate>

</Telerik:RadListView>

</asp:Panel>

<asp:Panel ID="Error" runat="server" Visible="false">

<asp:Label ID="lblerror" runat="server"></asp:Label>

</asp:Panel>

</div

>



Here is code behind file 


using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Collections.Generic;
using Microsoft.SharePoint;
using Telerik.Web.UI;
 
namespace CAS.EventsRollup.EventsRollup
{
    public partial class EventsRollupUserControl : UserControl
    {
        public List<EventData> eventItems = new List<EventData>();
        public const string LIST_NM = "Pages";
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
 
                //using (SPSite site = new SPSite("http://Site/web"))  {
                // using (SPWeb web = site.OpenWeb()){
                try
                {
 
                    //get refernce for News web
                    SPWeb web = SPContext.Current.Web;
                    string CamlQuery = @"<Where>
                                                 <Eq>
                                                    <FieldRef Name='ContentType' />
                                                    <Value Type='Text'>Event Publicity Page</Value>
                                                 </Eq>
                                              </Where><OrderBy><FieldRef Name='EventFirstOccurence' Ascending='False' /></OrderBy>";
                    string ViewFields = @"<FieldRef Name='Title1' />
                                                <FieldRef Name='PublishingRollupImage' />
                                                <FieldRef Name='Blurb' />
                                                <FieldRef Name='ID' />
                                                <FieldRef Name='Spotlightdatetime' /><FieldRef Name='Location' />";
                    SPQuery query = new SPQuery();
                    query.ViewFields = ViewFields;
                    query.Query = CamlQuery;
                    SPDocumentLibrary doclib = (SPDocumentLibrary)web.Lists[LIST_NM];
                    SPListItemCollection items = doclib.GetItems(query);
                    foreach (SPListItem item in items)
                    {
 
                        EventData events = new EventData();
                        events.ID = item["ID"].ToString();
                        if (item["Title1"] != null) {
                            events.Title = item["Title1"].ToString();
                        }
 
                        if (item["PublishingRollupImage"] != null) {
                            string[] PublishingRollupImage = item["PublishingRollupImage"].ToString().Split(new char[] { ' ' });
                            events.ImageUrl = PublishingRollupImage[2].Remove(0, 4).Replace("\"", "");
                            events.Visible = true;
                        }
                        else {
                            events.Visible = false;
                        }
                        if (item["Blurb"] != null) {
                            events.Excerpt = item["Blurb"].ToString();
                        }
                        events.PageUrl = item.File.ServerRelativeUrl;
                        if (item["Spotlightdatetime"] != null) {
                            events.EventDate = item["Spotlightdatetime"].ToString();
                        }
                        if (item["Location"] != null)  {
                            events.Location = item["Location"].ToString();
                        }
                       eventItems.Add(events);
 
                    }
                    eventsRollup.DataSource = eventItems;
 
                    //}     
                    //}
                }
                catch (Exception ex)
                {
                    Error.Visible = true;
                    lblerror.Text = string.Format("<p>Error: {0} :Description: {1}\n<br/>stack {2}</p>", ex.Source, ex.Message, ex.StackTrace);
                }
            }
        }
        protected void cmbPageSize_SelectedIndexChanged(object o, RadComboBoxSelectedIndexChangedEventArgs e)
        {
                eventsRollup.PageSize = int.Parse(e.Value);
                eventsRollup.CurrentPageIndex = 0;
                eventsRollup.Rebind();
        }
    }
}

Here is Business Class

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;



namespace CAS.EventsRollup

{

    public class EventData

    {

        public string Title { get; set; }

        public string ImageUrl { get; set; }

        public string Excerpt { get; set; }

        public string EventDate { get; set; }

        public string ID { get; set; }

        public string PageUrl { get; set; }

        public string Location { get; set; }

        public bool Visible { get; set; }

    }

}

Please advise

answered on 11 Oct 2010, 12:44 PM

Hi Ronak,

From the code you provided I see you are using simple binding for your listview control. In this case you will need change the page size manually, assign the data source for the list view and bind it inside the SelectedIndexChanged handler of the page size combobox. The alternative option would be to use advanced binding with NeedDataSource handling.

You can compare both approaches here.

I am not sure why the RadAjaxLoadingPanel does not appear in this case - your configuration seems correct. Can you check whether setting MinDisplayTime = 0 as in the example linked above makes a difference?

Kind regards,
Sebastian
the Telerik team

answered on 11 Oct 2010, 02:00 PM

Thanks for Your Reply.
after posting here i have modified the code above with following here is sample for HTML markup for Control.ascx

<div class="events-info">

<Telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxy1" runat="server">

<AjaxSettings>

<Telerik:AjaxSetting AjaxControlID="ListViewPanel1">

<UpdatedControls>

<Telerik:AjaxUpdatedControl ControlID="ListViewPanel1" />

</UpdatedControls>

</Telerik:AjaxSetting>

</AjaxSettings>

</Telerik:RadAjaxManagerProxy>

<asp:Panel ID="ListViewPanel1" runat="server">

<Telerik:RadListView ID="eventsRollup" DataKeyNames="ID" ItemPlaceholderID="EventsContainer" AllowPaging="true" runat="server">

<LayoutTemplate>

<h4 class="">Upcoming Events</h4>

<asp:PlaceHolder ID="EventsContainer" runat="server" />

<table cellpadding="0" cellspacing="0" width="100%;" style="clear: both;">

<tr>

<td>

<Telerik:RadDataPager ID="eventDataPager" runat="server" PagedControlID="eventsRollup" PageSize="5">

<Fields>

<Telerik:RadDataPagerButtonField FieldType="FirstPrev" />

<Telerik:RadDataPagerButtonField FieldType="Numeric" />

<Telerik:RadDataPagerButtonField FieldType="NextLast" />

<Telerik:RadDataPagerPageSizeField PageSizeText="Page Size:" />

<Telerik:RadDataPagerGoToPageField CurrentPageText="Page: " TotalPageText="of" SubmitButtonText="Go" TextBoxWidth="15" />

<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="<%# 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>

<ItemTemplate>

<div class="news-items">

<div class="image-area-left">

<img src='<%# Eval("ImageUrl")%>' alt="" width="122px" height="95px" />

<!--<asp:Image ID="eventImg" ImageUrl='<%# Eval("ImageUrl")%>' runat="server" Visible='<%# Eval("Visible")%>' Width="122px" Height="95px" />  -->

</div>

<div class="news-item">

<a href='<%# Eval("PageUrl")%>' title='<%# Eval("Title")%>' ><%# Eval("Title")%></a>

<p><%# Eval("EventDate")%></p>

<p><%# Eval("Location")%></p>

<div class="news-excerpt"><%# Eval("Excerpt")%></div>

</div>

</ItemTemplate>

<EmptyDataTemplate>

<h4>Upcoming Events</h4>

<div style="margin:5px;">There are no upcoming events...</div>

</EmptyDataTemplate>

</Telerik:RadListView>

</asp:Panel>

</div

>

Here is Code behind file Control.ascx.cs


public partial class EventsRollupUserControl : UserControl
    {
        public List<EventData> listOfEvents = new List<EventData>();
        public const string LIST_NM = "Pages";
        EventData eventItem = null;
       // SPWeb web = null;
        protected void Page_Load(object sender, EventArgs e)
        {
            try
                {
 
                    //get refernce for News web
                    SPWeb web = SPContext.Current.Web;
                    string CamlQuery = @"<Where>
                                                 <Eq>
                                                    <FieldRef Name='ContentType' />
                                                    <Value Type='Text'>Event Publicity Page</Value>
                                                 </Eq>
                                              </Where><OrderBy><FieldRef Name='EventFirstOccurence' Ascending='True' /></OrderBy>";
                    string ViewFields = @"<FieldRef Name='Title1' />
                                                <FieldRef Name='PublishingRollupImage' />
                                                <FieldRef Name='Blurb' />
                                                <FieldRef Name='ID' />
                                                <FieldRef Name='Spotlightdatetime' /><FieldRef Name='Location' />";
                    SPQuery query = new SPQuery();
                    query.ViewFields = ViewFields;
                    query.Query = CamlQuery;
                    SPDocumentLibrary doclib = (SPDocumentLibrary)web.Lists[LIST_NM];
                    SPListItemCollection items = doclib.GetItems(query);
                    foreach (SPListItem item in items)
                    {
 
                        eventItem = new EventData();
                        eventItem.ID = item["ID"].ToString();
                        if (item["Title1"] != null) {
                            eventItem.Title = item["Title1"].ToString();
                        }
 
                        if (item["PublishingRollupImage"] != null) {
                            string[] PublishingRollupImage = item["PublishingRollupImage"].ToString().Split(new char[] { ' ' });
                            eventItem.ImageUrl = PublishingRollupImage[2].Remove(0, 4).Replace("\"", "");
                            //events.Visible = true;
                        }
                        else {
                            //events.Visible = false;
                            eventItem.ImageUrl = "/news-events/events/PublishingImages/_t/music@DEspotlight_jpg.jpg";
                        }
                        if (item["Blurb"] != null) {
                            eventItem.Excerpt = item["Blurb"].ToString();
                        }
                        eventItem.PageUrl = item.File.ServerRelativeUrl;
                        if (item["Spotlightdatetime"] != null) {
                            eventItem.EventDate = item["Spotlightdatetime"].ToString();
                        }
                        if (item["Location"] != null)  {
                            eventItem.Location = item["Location"].ToString();
                        }
                        listOfEvents.Add(eventItem);
 
                    }
                    eventsRollup.DataSource = listOfEvents;
 
                }
                catch (Exception ex)
                {
                    Error.Visible = true;
                    lblerror.Text = string.Format("<p>Error: {0} :Description: {1}\n<br/>stack {2}</p>", ex.Source, ex.Message, ex.StackTrace);
                } 
        }

Now this seems to work perfect in Firefox but in IE when i try to change paga Size or navigate second page i keep getting 404 Error.

i am not sure what you mean by setting page size manually.

one more thing here i am working in sharepoint 2010 so i have like master page --->content page ---->Webpart as Usercontrol.

so i have place RadAjaxManager in Master page and user RadajaxmanagerProxy in Web control but still no luck...



Ronak

answered on 15 Oct 2010, 10:05 AM

cas-eventsrollup.zip

Hello Ronak,

I am reposting my reply to your ticket in the current forum thread for the benefit of other people that might stumble upon the same issue:

/////////////////////////////////////////////////////////////////REPLY TO TICKET 356307 ////////////////////////////////////////////////////////////////////

I tracked the issue and it seems yet another limitation of SharePoint 2010 when coupled with ajax. Please, take a look at the modified version your sample for a solution to the problem and do contact us again if the problem persists.

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

Hope it helps.

Best wishes,
Tsvetoslav
the Telerik team

answered on 25 Oct 2010, 12:54 PM

Hello Ronak,

I inspected the liver ulr you have provided as well as the code of the Web Part. The Web Part, itself, is perfectly all right, and as I have already mentioned, I tested it on my side successfully. What caught my attention, however, was that upon the paging ajax request the second list view page is displayed successfully for a moment and then disappears giving way to the 404 error page. I inspected the requests sent to the server with Fiddler and noticed that upon the paging ajax request, the application tries to get the following two resources:

/news-events/events/Pages/js/csshoever.htc
/news-events/events/Pages/js/pngbehavior.htc

Both return a 404 error. These resources seem to be a part of the application, however, I am not aware what the purpose of those dynamic HTML elements is and what they are responsible for. Could you provide more information on that? Then, you need to make sure that those files are first of all present within the /news-events/Pages/js virtual directory and that they are also checked-in and published in SharePoint. It is a common case with developers to add some resources to SharePoint to be used by a certain page and then forget to check those in and publish them.

Hope this information will shed some light on the problem.

All the best,
Tsvetoslav
the Telerik team