I have an aspx page which contains multiple(9) asp:GridView , each one under a separate Bootstrap Tab. (Code sample below)
This causes each asp:GridView and associated asp:DataSource to be executed before the page is served and rendered.
As most users will view only one or two Tabs, this feels too heavy and inefficient.
I'm ideally looking for a Magic fix which will action the GridView, DataSource and sql stored Procedure only if that Tab is selected, but I fear I've painted myself into a corner.
Any suggestions ?
<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>