[Solved] Trying to load each tab dynamically and submit from the same tab

[Sheetal]

Hi,

  I am trying to use Telerik's MVC Extension's TabStrip control. I need a tabstrip with each "tab" to be dynamically loaded when clicked on the inidvidual tabs. Each tab has a submit form and when the user clicks on the "Submit" button (each tab has its own "submit" and I would like to "Save" each tab individually), I would like to submit the individual tab. Also I wanted each tab to have its own URL (defined in the routing table). I am currently using "LoadContentForm" to load each individual tab and that seems to be working. However, I am having the following issues:

1. How do I submit each individual tab (form). I used the suggestions on the forum  - To make an AJAX call. However the contentURL is always null and I never was able to submit the form.
function onSelect(e)

    {

        var $item = $(e.item);

        var $link = $item.find('.t-link');

        var contentUrl = $link.data('ContentUrl');

        if (contentUrl)

        {

            $.get(contentUrl, function (data)

            {

                e.contentElement.html(data);

            });

        }

    }

2. Also Another issue I seem to have is that when I assign each tab page as a seperate URL (in route table - global.asax page), when I click on the tab page, the page is displayed on a seperate page and is not rendered within the tabStrip.

Any help with these issues is greatly appreciated, I have been trying to achieve these functionalities for the past couple of days without any luck.

Thanks,
Sheetal.

[Atanas Korchev]

Hi Sheetal,

The ContentUrl of a tab is the url which loads that tab. You are not supposed to use it in order to submit a form. You must submit the form to a separate URL.

 The second problem occurs because you are submitting the form with an HTTP POST request which refreshes the whole page. Using ajax to submit will prevent this.

Regards,
Atanas Korchev
the Telerik team