reLoad tabstrip contents on select event

[Sajjad]

I am trying to reload contents of tabs on every click on tabs. How can I achieve this.. As I am trying to access current object in select event by using following code, but it gives error of null object.

 <kendo:tabStrip name="tabstrip2" select="onSelect">
        <kendo:tabStrip-items >
                    <kendo:tabStrip-item  text="Bid Screen" selected="true"  contentUrl="${ajaxContent1}"></kendo:tabStrip-item>

                    <kendo:tabStrip-item text="Clients" contentUrl="${ajaxContent2}"></kendo:tabStrip-item>
            <kendo:tabStrip-item text="Reports" contentUrl="${ajaxContent3}"></kendo:tabStrip-item>
                 <kendo:tabStrip-item text="Downloads" contentUrl="${ajaxContent4}"></kendo:tabStrip-item>
                
        </kendo:tabStrip-items>
             
    </kendo:tabStrip>

 function onSelect (e) {
     var tabStrip = $("#tabStrip2").data("kendoTabStrip");
  alert(tabStrip);//shows null
                  
    }

I am not using duplicate js files ,If I remove js files it does not show tabs.

thanks

[Boyan Dimitrov]

Hello Sajjad,

 

Most probably the reason for such behavior is loading more than one jQuery. If jQuery is included more than once in the page all existing jQuery plugins (including Kendo UI) will be wiped out.

 

In your case the tabs should load partial views instead of regular views (regular views use the layout page, where I assume your scripts definitions are). The views loaded by the tabs should not be associated to the default layout.  

 

Regards,
Boyan Dimitrov
Telerik