Reputation: 894
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)
Upvotes: 1
Views: 4584
Reputation: 1246
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);
}
});
Upvotes: 1