reLoad tabstrip contents on select event

2 posts, 0 answers
  1. Sajjad
    Sajjad avatar
    4 posts
    Member since:
    Jul 2013

    Posted 10 Dec 2015 Link to this post

    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>

     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.


  2. Boyan Dimitrov
    Boyan Dimitrov avatar
    2062 posts

    Posted 12 Dec 2015 Link to this post

    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.  


    Boyan Dimitrov
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top