TabStrip, Listview & Paging

3 posts, 0 answers
  1. Roger
    Roger avatar
    38 posts
    Member since:
    May 2008

    Posted 26 Jan 2011 Link to this post

    I have a relatively simple page that contains a tagstrip, and depending on what tab is clicked I want to bind a listview for that appropriate pictures, including paging on the listview, this seems to work fine except for paging on the listview.

    When I click to go to the next page, the need datasource is executed twice the first time my viewstate variable is nothing, even though it's been set when I click the tab, the second time it is something and the listview is bound, but the paging doesn't change.

    I was getting a javascript serialization error earlier but it's went away for now.

    Any ideas?

    Aspx
    <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
        <telerik:RadTabStrip ID="RadTabStripSpecies" runat="server" MultiPageID="RadMultiPage1">
        </telerik:RadTabStrip>
        <div class="DesignWidth">
            <telerik:RadListView runat="server" ID="RadListViewPictures" AllowPaging="True" DataKeyNames="p_PictureID"
                EnableViewState="False">
                <ItemTemplate>
                    <div class="rlvI" style="padding: 0px; margin: 5px; border: 10px ridge #C0C0C0; overflow: hidden;">
                        <img alt='<%# Eval("p_ImageFileName") %>' src='<%# Eval("p_ImageFileName","SquareThumbnail.ashx?p={0}") %>'
                            border="0" />
                    </div>
                </ItemTemplate>
                <EmptyDataTemplate>
                    <div class="RadListView RadListView_<%# Container.Skin %>">
                        <div class="rlvEmpty">
                            There are no items to be displayed.</div>
                    </div>
                </EmptyDataTemplate>
                <LayoutTemplate>
                    <div class="RadListView RadListViewFloated RadListView_<%# Container.Skin %>">
                        <div class="rlvFloated rlvAutoScroll">
                            <div id="itemPlaceholder" runat="server">
                            </div>
                        </div>
                        <telerik:RadDataPager ID="RadDataPager1" runat="server" PageSize="18" EnableViewState="False">
                            <Fields>
                                <telerik:RadDataPagerTemplatePageField>
                                    <PagerTemplate>
                                    </PagerTemplate>
                                </telerik:RadDataPagerTemplatePageField>
                                <telerik:RadDataPagerButtonField FieldType="FirstPrev" FirstButtonText="first" NextButtonText="next"
                                    PrevButtonText="previous" LastButtonText="last" />
                                <telerik:RadDataPagerSliderField />
                                <telerik:RadDataPagerButtonField FieldType="NextLast" PrevButtonText="previous" LastButtonText="last"
                                    NextButtonText="next" FirstButtonText="first" />
                                <telerik:RadDataPagerTemplatePageField>
                                    <PagerTemplate>
                                    </PagerTemplate>
                                </telerik:RadDataPagerTemplatePageField>
                            </Fields>
                        </telerik:RadDataPager>
                    </div>
                </LayoutTemplate>
            </telerik:RadListView>
        </div>
    </asp:Content>

    Codebehind
     Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
            If Not IsPostBack Then
                Me.BindRadTabStripSpecies()
            End If
        End Sub
      
        Private Sub BindRadTabStripSpecies()
            Dim dt As New DataTable
      
            Try
                dt = Me.objDataAccess_Species.GetSpecies_Pictures
            Catch ex As Exception
                Me.SystemMessage("Error", "Data Retrieve Failed!", ex.Message)
                Exit Sub
            End Try
      
            Me.RadTabStripSpecies.CausesValidation = False
            Me.RadTabStripSpecies.DataTextField = "Name"
            Me.RadTabStripSpecies.DataNavigateUrlField = ""
            Me.RadTabStripSpecies.DataFieldID = "s_SpeciesID"
            Me.RadTabStripSpecies.DataValueField = "s_SpeciesID"
            Me.RadTabStripSpecies.DataFieldParentID = "sg_ParentSpeciesGroupID"
            Me.RadTabStripSpecies.DataSource = dt
            Me.RadTabStripSpecies.DataBind()
        End Sub
      
        Private Sub RadTabStripSpecies_TabClick(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadTabStripEventArgs) Handles RadTabStripSpecies.TabClick
            e.Tab.Selected = True
            ViewState("Selects_SpeciesID") = CType(Me.RadTabStripSpecies.SelectedTab.Value, Integer)
            Me.RadListViewPictures.Rebind()
        End Sub
      
        Private Sub RadListViewPictures_NeedDataSource(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadListViewNeedDataSourceEventArgs) Handles RadListViewPictures.NeedDataSource
            If IsNothing(ViewState("Selects_SpeciesID")) Then
                Exit Sub
            End If
      
            Dim s_SpeciesID As Integer = CType(ViewState("Selects_SpeciesID"), Integer)
      
            Dim dt As New DataTable
      
            Try
                dt = Me.objDataAccess_Picture.GetPicture_p_SpeciesID(s_SpeciesID)
            Catch ex As Exception
                Me.SystemMessage("Error", "Data Retrieve Failed!", ex.Message)
                Exit Sub
            End Try
      
            Dim Pictures As String = System.Configuration.ConfigurationManager.AppSettings("Pictures")
            Dim PicturesThumbs As String = System.Configuration.ConfigurationManager.AppSettings("PicturesThumbs")
      
            'Add a couple computed columns concatenating our Picture key value
            'dt.Columns.Add("ImageThumbURL", GetType(String), String.Format("'{0}' + {1}", PicturesThumbs, "p_ImageFileName"))
            'dt.Columns.Add("ImageURL", GetType(String), String.Format("'{0}' + {1}", Pictures, "p_ImageFileName"))
      
            Me.RadListViewPictures.DataSource = dt
        End Sub
  2. Roger
    Roger avatar
    38 posts
    Member since:
    May 2008

    Posted 27 Jan 2011 Link to this post

    If I change my variable to Session("Selects_SpeciesID") paging works, however, when I click to change tabs, it rebinds the listview for the old id then binds for my new tab id.

    The NeedDatasource is executing before the tabclick event.

    It works, but there's a significant amount of extra un-needed IO on the DB.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Tsvetoslav
    Admin
    Tsvetoslav avatar
    1823 posts

    Posted 01 Feb 2011 Link to this post

    Hello Roger,

    You should switch ViewState for the RadListView and RadDataPager back on.

    Hope it helps.

    Best wishes,
    Tsvetoslav
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
Back to Top