散步在海洋中的碼農

參考文章網址

 

https://www.aspsnippets.com/Articles/Bootstrap-Tabs-Maintain-Selected-Active-Tab-on-PostBack-in-ASPNet.aspx

20206022  在bootstrap4愈到一些狀況

post會跑到第1個頁籤，在切換到第2個頁籤....用下方寫法解決

 

			 var tabName = $("[id*=TabName]").val() != "" ? $("[id*=TabName]").val() : "Personal";
            $('#Tabs a[href="#' + tabName + '"]').tab('show');
            if ($("[id*=TabName]").val() == "" ||  tabName=="Personal") {
                $("#Personal").addClass('active').addClass('show');
            }

            $("#Tabs a").click(function () {                
                $("[id*=TabName]").val($(this).attr("href").replace("#", ""));
            });

參考版型https://wrapbootstrap.com/theme/inspinia-responsive-admin-template-WB0R5L90S

修改結果如下

<asp:HiddenField ID="TabName" runat="server" />
        <script>
           $(function () {
                    var tabName = $("[id*=<%= TabName.ClientID %>]").val() != "" ? $("[id*=<%= TabName.ClientID %>]").val() : "tab01";
            $('#Tabs a[href="#' + tabName + '"]').tab('show');
            if ($("[id*=<%= TabName.ClientID %>]").val() == "" || tabName == "tab01") {
                $("#tab01").addClass('active');
            }

                $("#Tabs a").click(function () {                   
                $("[id*=<%= TabName.ClientID %>]").val($(this).attr("href").replace("#", ""));
            });
            })
      

        </script>
     

 

以上文章僅用紀錄資料使用.....