Telerik: Calling Stored Procedures on Partial Page Postbacks with RadTabStrip

Question

My boss wants to use Telerik and I'm new to this so still trying to figure it out. What I'm essentially trying to do:

• During page load, only load minimal data
• Have a navigation tab.
• When a tab is clicked, call a stored procedure specific to that tab. A partial postback should occur so that only the relevant data is loaded.

I can accomplish this without Telerik using ASP:UpdatePanels and an unordered list of ASP:Buttons for the navbar. I can't seem to figure out how to do it with Telerik (Telerik UI for ASP.NET)

I think I would need to combine the RadAjaxManager with the RadTabStrip (Note: within ViewPages I have nested another RadTabStrip to view Current/Past data for each Navbar item. I'm not sure if this complicates matters.)

So my main question is basically how to make it so that "on nav tab click, call a specific function."

Here is some sample code I'm working with:

AJAX:

<telerik:RadAjaxLoadingPanel runat="server" ID="LoadingPanel1" Skin="MetroTouch">
</telerik:RadAjaxLoadingPanel>
<telerik:RadAjaxManager runat="server" ID="RadAjaxManager1" EnablePageHeadUpdate="true"  EnableAJAX="true">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadTabStripAccount">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadTabStripAccount" ></telerik:AjaxUpdatedControl>
                <telerik:AjaxUpdatedControl ControlID="RadMultiPageAccount" LoadingPanelID="LoadingPanel1"></telerik:AjaxUpdatedControl>
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

I can get the following to work without AJAX. All the data will load at once and you can seamlessly click between tabs. However, I only want to load one tab's info at a time and retrieve new data only when a different tab is selected.

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
        <div class="demo-container no-bg size-narrow">
            <div class="demo-content" style="width: 900px;">
                <telerik:RadTabStrip runat="server" ID="RadTabStripAccount" Orientation="VerticalLeft" AutoPostBack="false" 
                    SelectedIndex="0" MultiPageID="RadMultiPageAccount" Style="display: inline-block;
                    float: left; margin-right: 2em;" Skin="Default">
                    <Tabs>
                        <telerik:RadTab Text="Registration Applications"   Style="margin-top: 4em;"   >
                        </telerik:RadTab>
                        <telerik:RadTab Text="Role">
                        </telerik:RadTab>
                    </Tabs>
                </telerik:RadTabStrip>
                <telerik:RadMultiPage runat="server" ID="RadMultiPageAccount" SelectedIndex="0" CssClass="multiPage" Style="display: inline-block; width: 600px; height: 550px; overflow-y: auto;">
                    <telerik:RadPageView runat="server" ID="RadPageViewRegApp">
                        <telerik:RadTabStrip runat="server" ID="RadTabStripRegApp" MultiPageID="RadMultiPageRegApp"
                            Orientation="HorizontalTop" Skin="Simple" SelectedIndex="0" Style="display: inline-block;">
                            <Tabs>
                                <telerik:RadTab Text="Current" Height="30px">
                                </telerik:RadTab>
                                <telerik:RadTab Text="Past" Height="30px">
                                </telerik:RadTab>
                            </Tabs>
                        </telerik:RadTabStrip>
                        <telerik:RadMultiPage runat="server" ID="RadMultiPageRegApp" SelectedIndex="0" CssClass="innerMultiPage"
                            Style="padding: 15px; ">
                            <telerik:RadPageView runat="server" ID="RadPageViewRegAppCurrent">
                                Applications - Current:<br />
                                <asp:Label ID="testerson" runat="server" Text="Testerson"></asp:Label>
                                <div style="width: 100%; height: 100%; border: 1px solid black;">
                                <table class="table table-striped table-hover" >
                                    <asp:PlaceHolder runat="server" ID="PlaceHolder2"></asp:PlaceHolder>
                                </table>
                                </div>
                            </telerik:RadPageView>
                            <telerik:RadPageView runat="server" ID="RadPageViewRegAppPast">
                                Applications - Past:<br />
                                <div style="width: 100%; height: 100%; border: 1px solid black;">
                                <table class="table table-striped table-hover">
                                    <asp:PlaceHolder runat="server" ID="PlaceHolder_RegAppPast"></asp:PlaceHolder>
                                </table>
                                </div>
                            </telerik:RadPageView>
                        </telerik:RadMultiPage>
                    </telerik:RadPageView>
                    <telerik:RadPageView runat="server" ID="RadPageViewRole">
                        <telerik:RadTabStrip runat="server" ID="RadTabStripRole" MultiPageID="RadMultiPageRole"
                            Orientation="HorizontalTop" Skin="Simple" SelectedIndex="0" Style="display: inline-block;">
                            <Tabs>
                                <telerik:RadTab Text="Current" Height="30px" >
                                </telerik:RadTab>
                                <telerik:RadTab Text="Past" Height="30px">
                                </telerik:RadTab>
                            </Tabs>
                        </telerik:RadTabStrip>
                        <telerik:RadMultiPage RenderSelectedPageOnly="true"  runat="server" ID="RadMultiPageRole" SelectedIndex="0" CssClass="innerMultiPage"
                            Style="padding: 15px;">
                            <telerik:RadPageView runat="server" ID="RadPageViewRoleCurrent">
                                Role - Current:</br>
                                <table class="table table-striped table-hover" style="border: 1px solid black;">
                                    <asp:PlaceHolder runat="server" ID="PlaceHolder3"></asp:PlaceHolder>
                                </table>
                            </telerik:RadPageView>
                            <telerik:RadPageView runat="server" ID="RadPageViewRolePast">
                                Role - Past:<br />
                                <table class="table table-striped table-hover" style="border: 1px solid black;">
                                    <asp:PlaceHolder runat="server" ID="PlaceHolder_MbrPast"></asp:PlaceHolder>
                                </table>
                            </telerik:RadPageView>
                        </telerik:RadMultiPage>
                    </telerik:RadPageView>
                </telerik:RadMultiPage>
            </div>
        </div>
    </telerik:RadAjaxPanel>