Bootstrap选项卡下的多个GridView

Question

我有一个aspx页面，其中包含多个（9）asp：GridView，每个都在一个单独的Bootstrap Tab下。 （下面的代码示例）

这会导致每个asp：GridView和关联的asp：DataSource在提供和呈现页面之前执行。

由于大多数用户只会查看一个或两个标签，因此感觉过于沉重且效率低下。

我理想地寻找一个Magic修复程序，只有在选中该选项卡时才会对GridView，DataSource和sql存储过程执行操作，但我担心我已将自己画成一个角落。

有什么建议吗？

<div class="container-fluid">

    <ul class="nav nav-tabs" role="tablist" id="mapTabs">
        <li role="presentation" class="active"><a href="#summary" aria-controls="profile" role="tab" data-toggle="tab">Summary</a></li>
        <li role="presentation"><a href="#africa" aria-controls="messages" role="tab" data-toggle="tab">Africa</a></li>
        <li role="presentation"><a href="#asia" aria-controls="settings" role="tab" data-toggle="tab">Asia</a></li>
        <li role="presentation"><a href="#canada" aria-controls="settings" role="tab" data-toggle="tab">Canada</a></li>
        <li role="presentation"><a href="#europe" aria-controls="settings" role="tab" data-toggle="tab">Europe</a></li>
        <li role="presentation"><a href="#oceana" aria-controls="settings" role="tab" data-toggle="tab">Oceana</a></li>
        <li role="presentation"><a href="#japan" aria-controls="settings" role="tab" data-toggle="tab">Japan</a></li>
        <li role="presentation"><a href="#south-america" aria-controls="settings" role="tab" data-toggle="tab">South America</a></li>
        <li role="presentation"><a href="#usa" aria-controls="settings" role="tab" data-toggle="tab">U.S.A.</a></li>
        <li role="presentation"><a href="#all" aria-controls="settings" role="tab" data-toggle="tab">All</a></li>
        <li role="presentation"><a href="#testable" aria-controls="settings" role="tab" data-toggle="tab">Test List</a></li>
    </ul>

    <div class="tab-content wide-tab">
        <div role="tabpanel" class="tab-pane active" id="summary">
            <div>
                <asp:GridView ID="grdSummary" class="wide-grid" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDsAudit">
                    <Columns>
                        <asp:BoundField DataField="sector_name" HeaderText="Sector" SortExpression="sector_name"></asp:BoundField>
                        <asp:BoundField DataField="numResorts" HeaderText="Number of Resorts" SortExpression="numResorts"></asp:BoundField>
                        <asp:BoundField DataField="numCountries" HeaderText="Number of Countries" SortExpression="numCountries"></asp:BoundField>
                    </Columns>
                </asp:GridView>
                <asp:SqlDataSource runat="server" ID="SqlDsAudit" ConnectionString='<%$ ConnectionStrings:SnowKingCs %>' ProviderName='<%$ ConnectionStrings:SnowKingCs.ProviderName %>' SelectCommand="audit_by_sectors" SelectCommandType="StoredProcedure"></asp:SqlDataSource>
            </div>
        </div>

        <div role="tabpanel" class="tab-pane" id="africa">
            <div>
                <asp:GridView ID="grdAfrica" class="wide-grid" runat="server" AutoGenerateColumns="False" DataKeyNames="resort_id" DataSourceID="SqlDsAfrica">
                        <Columns>
                            <asp:BoundField DataField="country_name" HeaderText="Country" SortExpression="country_name"></asp:BoundField>
                            <asp:HyperLinkField DataNavigateUrlFields="resort_id"
                                DataNavigateUrlFormatString="~/ResortViewer.aspx?ID={0}"
                                DataTextField="resort_name"
                                HeaderText="Resort"
                                SortExpression="resort_name" />
                        </Columns>
                    </asp:GridView>
                <asp:SqlDataSource runat="server" ID="SqlDsAfrica" 
                        ConnectionString='<%$ ConnectionStrings:SnowKingCs %>' 
                        ProviderName='<%$ ConnectionStrings:SnowKingCs.ProviderName %>' 
                        SelectCommand="get_resorts" SelectCommandType="StoredProcedure">
                        <SelectParameters>
                            <asp:ControlParameter Name="_SectorName" ControlID="txtFilter" PropertyName="Text" DefaultValue="Africa"/>
                        </SelectParameters>
                    </asp:SqlDataSource>
            </div>
        </div>