Delay new tab displaying until Controller action completed

[Alex]

Hi.  I would like to know if there is any way to delay a clicked tab from displaying until my corresponding MVC controller action is completed?  The following code below calls an MVC controller "Controller" with the ActionResult "ControllerAction" and "message" is the name of the tab I am displaying for validation.
Currently, I have a function called within the if statement if(a_tabPageSelected == "MyTab") which takes a while to complete and would prefer if the tab section didn't appear until the function completes.

Controller.cs

public ActionResult ControllerAction(string a_tabPageSelected)
{
   if(a_tabPageSelected == "MyTab")
   {
        /// do stuff before tab page appears
   }

/// now display tab page using some command and return View
return View("Tabsection");

View.cshtml 

function onSelect(e) {

   var message = $(e.item).find("> .k-link").text();

   $.get('/Controller/ControllerAction/?a_tabPageSelected=' + message, function (data) {

   $("#TabDiv").html(data);

   });

}


[Kiril Nikolov]

Hi Alex,

While such functionality is not supported built-in, you might achieve something similar using the select event and preventing it if you do not want to navigate to the item, and when the ajax request is completed you can programmatically navigate to the tab. Please check the following example that I created and you can use as a base reference:

http://dojo.telerik.com/abOP

Regards,
Kiril Nikolov
Telerik

 

 

[Alex]

Alright, so I just would add the preventDefault() command after my call to my controller like below.  After, I would have my controller navigate to the selected tab using an Ajax request.  Do you have any examples for this scenario where the tabstrip is created using Razor?  Something that begins like this @(Html.Kendo().TabStrip()  ?

function onSelect(e) {
   var message = $(e.item).find("> .k-link").text();
   $.get('/Controller/ControllerAction/?a_tabPageSelected=' + message, function (data) {
   $("#TabDiv").html(data);
   });
   e.preventDefault();
}

[Kiril Nikolov]

Hi Alex,

The solution is mostly JavaScript based, so the only specific syntax for the MVC should be attaching the select event. Please try it out and if you have any issue, provide a runnable sample and we will be happy to help.

Regards,
Kiril Nikolov
Telerik