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

Load on Demand PageViewCreated not called

2 Answers 79 Views

TabStrip

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

Martin Roussel asked on 08 Jan 2013, 06:40 PM

Hi,

sorry to create another Load On Demand post but it seems I cant find my issue in the previous ones Ive searched in. In my case, when trying to implement Load On Demand on my RadTabStrip, Ive noticed a weird behavior in the code.

When clicking on the tabs in the order they are presented and I skip one, then when I click on that skipped tab, its RadMultiPage's PageViewCreated dont get called. By looking at the tab's OnClientTabSelecting client-side function, it seems the tab already has a pageview assigned and it's id is the same then the tab we click when doing the skipping.

Here's the code to replicate the problem with 4 tabs:

<%@ Page Language="C#" AutoEventWireup="True" Inherits="PL.Test" Codebehind="Test.aspx.cs" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/tr/xhtml11/dtd/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head id="Head1" runat="server">

<title></title>

</head>

<body>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<script type="text/javascript">

function onTabSelecting(sender, args) {

if (args.get_tab().get_pageView()) {

if (args.get_tab().get_pageView().get_id()) {

alert("pageview of ID: " + args.get_tab().get_pageView().get_id() + " already loaded");

args.get_tab().set_postBack(false);

}

</script>

</telerik:RadCodeBlock>

<form id="form1" runat="server">

<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadTabStrip1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadTabStrip1">

</telerik:AjaxUpdatedControl>

<telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="RadAjaxLoadingPanel1">

</telerik:AjaxUpdatedControl>

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadMultiPage1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="RadAjaxLoadingPanel1">

</telerik:AjaxUpdatedControl>

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadAjaxManager1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadTabStrip1" LoadingPanelID="RadAjaxLoadingPanel1">

</telerik:AjaxUpdatedControl>

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="WebBlue" />

<telerik:RadTabStrip ID="RadTabStrip1" runat="server" AutoPostBack="false" Skin="WebBlue" EnableDragToReorder="true" MultiPageID="RadMultiPage1" Orientation="HorizontalTop"

SelectedIndex="0" OnTabClick="RadTabStrip1_TabClick" OnClientTabSelecting="onTabSelecting" >

</telerik:RadTabStrip>

<telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0" OnPageViewCreated="RadMultiPage1_PageViewCreated">

</telerik:RadMultiPage>

</form>

</body>

</html>

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

namespace PL

{

public partial class Test : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

{

CreateTabs();

}

private void CreateTabs()

{

AddNewTab(1);

AddNewTab(2);

AddNewTab(3);

AddNewTab(4);

RadTabStrip1.DataBind();

}

private void AddNewTab(int intTabIndex)

{

RadTab rootTab = null;

RadPageView pv = null;

rootTab = new RadTab();

RadTabStrip1.Tabs.Add(rootTab);

rootTab.Text = "Tab" + " " + intTabIndex.ToString();

rootTab.Value = "Tab_" + intTabIndex.ToString();

if (intTabIndex == 1)

{

pv = new RadPageView();

pv.ID = rootTab.Value;

RadMultiPage1.PageViews.Add(pv);

RadTabStrip1.Tabs[RadTabStrip1.Tabs.Count - 1].Selected = true;

RadMultiPage1.PageViews[RadMultiPage1.PageViews.Count - 1].Selected = true;

}

protected void RadMultiPage1_PageViewCreated(object sender, RadMultiPageEventArgs e)

{

Console.WriteLine(e.PageView.ID);

}

protected void RadTabStrip1_TabClick(object sender, RadTabStripEventArgs e)

{

AddPageView(e.Tab);

e.Tab.PageView.Selected = true;

}

private void AddPageView(RadTab tab)

{

RadPageView pv = new RadPageView();

pv.ID = tab.Value;

RadMultiPage1.PageViews.Add(pv);

tab.PageViewID = pv.ID;

}

Page will start and create Tab 1. If you click on Tab 3 then Tab 2, you'll notice that Tab 2 pageview ID is already known and that "RadMultiPage1_PageViewCreated" doesnt get called. Same if you refresh and click Tab 2, then Tab 4 and then Tab 3. If you go 2, 3 and 4, all is fine. Is something wrong in my code?

TIA

Martin

2 Answers, 1 is accepted

answered on 11 Jan 2013, 01:32 PM

Hello Martin,

Actually, the implementation that you use is the correct one. But, I can suggest you to use the get_pageViewID method, like it is demonstrated in our online demo here. Please consider the following implementation :

function onTabSelecting(sender, args) {

if (args.get_tab().get_pageViewID()) {

alert("pageview of ID: " + args.get_tab().get_pageViewID() + " already loaded");

args.get_tab().set_postBack(false);

}

Greetings,
Nencho
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.