Select a Kendo Tab after a page refresh

Question

How do I select a kendo tab based on the completion of an event on a page?

I have a kendo ui tabstrip with 5 tabs, on the 5th tab (index 4) I have an upload control that fires an onComplete event when its done with it's upload. At that time, I would like to refresh the page and bring the focus back to the 5th tab by selecting it.

The code:

    function onImageComplete(e) {

    var tabstrip = $("#tabstrip").kendoTabStrip().data("kendoTabStrip");
    tabstrip.select(4);

    location.reload(true);
}

The code to select the tab desired works fine in my document ready function, but of course on document ready, I want the first tab to display. I only want the fifth tab after an event on tab 5.

Thanks

(any script advice is welcome)

why do you refresh the page? – MustafaP Feb 05 '14 at 11:50 — MustafaP, Feb 05 '14 at 11:50
By the way I couldn't understand your problem ? – MustafaP Feb 05 '14 at 11:54 — MustafaP, Feb 05 '14 at 11:54

score 1 · Accepted Answer · edited May 23 '17 at 11:44

If you really need to reload the page, then instead of using location.refresh use window.location, passing the URL of the current page. This time add a query string parameter, something like &selectTabIndex={index of tab to be selected}.

Within $(document).ready() check for that query string using something like the getParameterByName function detailed here and then use the kendo tabstrip select() function, passing in the value of the query string, i.e.:

$(document).ready(function() {
  var selectTabIndex = getParameterByName('selectTab');

  if (selectTabIndex != null) {
    var tabStrip = $('#tabStrip').getKendoTabStrip();
    tabStrip.select(selectTabIndex);
  }
});

Select a Kendo Tab after a page refresh

1 Answers1