How To Active Bootstrap Tab after Button Click in ASP.NET

Question

I am working in asp.net and i use twitter bootstrap plugins. In my form i use a Tab. There are two option in Tab. #1 is Map and #2 is Address . Basically i submit a form and save the data into database when data is save then i want saved data shown in #2 Tab ( Address Tab ). I found many article in stackoverflow related it, but i not achieve this.

Code:-ASP

            <div class="Map-Panel">
                <ul class="nav nav-tabs">
                    <li class="active"><a data-toggle="tab" href="#divMap">Map</a></li>
                    <li><a data-toggle="tab" href="#divAddress">Address</a></li>
                </ul>
                <div class="tab-content">
                    <div id="divMap" class="tab-pane fade in active">
                        <div id="geomap" style="width: 100%; height: 450px;">
                            <p>Loading Please Wait...</p>
                        </div>
                    </div>
                    <div id="divAddress" class="tab-pane fade">
                        <asp:DataList ID="dlAddress" runat="server" CellPadding="4" ForeColor="#333333" RepeatColumns="1" Width="100%">
                        </asp:DataList>
                    </div>
                </div>
            </div>

Code:-Javascript

$('#<%= btnSave.ClientID %>').click(function () {
            $('.nav-tabs > .active').next('li').find('a').trigger('click');
});

If i use HTML submit button then i able to active other tab but through this i can't save my data into database. So help me.

Answer 1

Did yout tried to wrap both tabs inside the same form? This way will send all data from both tabs to your server side script.