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

[Solved] TabStrip using LoadContentFrom Won't Dynamically Reload

4 Answers 203 Views

TabStrip

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

This question is locked. New answers and comments are not allowed.

Chris asked on 04 Feb 2011, 11:42 PM

Hi,
I've been all through this forum for days trying to figure this out with no luck. So, here's my problem:
I have a tabstrip loaded up in a view. I am binding to a ViewData variable to create my individual tabs. And, using LoadContentFrom to dynamically load the content for each tab. This all works fine. But, I would also like to reload each tab when they are clicked on, which is not working.
I've looked through this thread in particular (Reload a Tab on Click) for help with this. I have implemented this solution and still have no success. I understand that the data() method has nothing in it on initial load. But, since there is only 1 load, how will it ever be populated?
Based on the afore mentioned thread, I have a script for the onSelect event that does get called every time a tab is clicked. But, $link.data('ContentURL') is always undefined. And I can't figure out how to get anything in there. So, here's a sample of my code:

<% //Html.Telerik().StyleSheetRegistrar();

object routeValues = new object();

Html.Telerik().ScriptRegistrar();

Html.Telerik().TabStrip()

.Name("MyTab")

.ClientEvents(events => events

.OnSelect("onSelect")

)

.BindTo((List<TabItem>)ViewData["TabCollection"],

(item, tabdata) =>

{

item.Text = tabdata.Text;

switch (tabdata.Index)

{

//case 0: //Inv/PL Header VIew

// break;

case 1: //Update SKU/QTY View

routeValues = new

{

invPLHeaderID = Model.InvPLHeaderID,

vendorID = Model.VendorCompanyID,

};

break;

//case 2: //Invoice View

// break;

//case 3: //Packing List View

// break;

//case 4: //Container View

// break;

default:

routeValues = new

{

invPLHeaderID = Request.QueryString["invPLHeaderID"]

};

break;

}

item.ContentUrl = Url.Action(tabdata.Action, tabdata.Controller, routeValues);

})

.SelectedIndex(0)

.Render();

%>

And for the onSelect() handler:

<script type="text/javascript">

function onSelect(e)

{

var $item = $(e.item);

var $link = $item.find('.t-link');

var contentUrl = $link.data('ContentUrl');

if (contentUrl)

{

$.get(contentUrl, function (data)

{

e.contentElement.html(data);

});

}

</script>

Again... No matter when I click on a tab, the script always runs and $link.data('ContentURL') is always undefined. Additionally, though I don't know how important this is, e.contentElement.html is also always undefined.
I'm wondering if this is a bug or not in the control. I am currently using the Q3 2010 version (2010.3.1110) and seeing this issue. I have noticed that binding has caused weird problems with other controls and maybe it's happening here. I have also noticed that the tabs, once loaded, lose their links and change to # (which I'm sure is expected).
So, is there any way to fix this?

Cheers,
Chris

[Solved] TabStrip using LoadContentFrom Won't Dynamically Reload

4 Answers, 1 is accepted