如何在zf2的bootstrap3中保持相同的選項卡？

Question

我在php中使用了引導程序3個選項卡，但是當我刷新我以前的選項卡時，表單字段顯示爲空，如何在刷新頁面後顯示這些字段？

這裏是我的代碼：

  var hash = window.location.hash; 
      $('#signup_tabs_group a[href="' + hash + '"]').tab('show');  
     // Get form data and enforce tab wise validation 
     var form_data = $.parseJSON($('form').attr('data-elements')); 
     $("#continue_to_account").click(function (e) { 
      if ($("#password1").val() != '' && $("#password1").val() != $("#password2").val()) { 
       popoverContent('password2', "Please Confirm Password.", "right"); 
       $("#password2").popover('show'); 
       $("#password2").addClass('mypopover'); 
       $("#password2").focus(); 
       return false; 
      } else { 
       $("#password2.mypopover").popover('hide'); 
      } 
      if ($("#email").val() != '' && $("#email").val() != $("#email2").val()) { 
       popoverContent ('email2', "Please Confirm Email.", "right"); 
       $("#email2").popover('show'); 
       $("#email2").focus(); 
       $("#email2").addClass('mypopover'); 
       return false; 
      } else { 
       $("#email2.mypopover").popover('hide'); 
      } 
      $("ul.nav-tabs > li > a").on("shown.bs.tab", function (e) { 
       var id = $(e.target).attr("href").substr(1); 
       window.location.hash = id; 
      }); 
      var custom_form = []; 
      var required_elements = ['email', 'email2', 'username', 'password1', 'password2']; 
      for (var c = 0; c < form_data.length; c++) { 
       if (typeof(form_data[c].name) != "undefined" && required_elements.indexOf(form_data[c].name) != -1) { 
        custom_form[c] = form_data[c]; 
       } 
      } 
      if (validations(custom_form, $('form'), $(this), 'right') != false) { 
       e.preventDefault(); 
       $('#signup_tabs_group a[href="#contact"]').tab('show'); 
       return true; 
      } 
      return false; 
     }); 
     $("#back_to_account").click(function (e) { 
      e.preventDefault(); 
      $('#signup_tabs_group a[href="#account"]').tab('show'); 
     }); 
     $("#continue_to_website").click(function (e) { 
      var custom_form = []; 
      var required_elements = [{'contact_first_name': true}, {'contact_last_name': true}, {'country': true}, {'account_type': true}, {'address1': true}, {'address2': false}, {'address3': false}, {'city': true}, {'state': false}, {'zipcode': true}, {'phone_code': false}, {'phone_number': true}, {'fax': false}, {'currency': false}]; 
      if (
       typeof($('input[name=account_type]:checked').val()) != 'undefined' && 
       $('input[name=account_type]:checked').val() == 'company' 
      ) { 
       required_elements.push({'company_name': true}); 
      } 
      //return false; 
      for (var c = 0; c < form_data.length; c++) { 
       if (
        typeof(form_data[c].name) != "undefined" && 
        typeof(form_data[c].validation) != "undefined" && 
        typeof(form_data[c].validation.required) != "undefined" 
       ) { 
        for (var i = 0; i < required_elements.length; i++) { 
         if (typeof(required_elements[i][form_data[c].name]) != 'undefined') { 
          form_data[c].validation.required = required_elements[i][form_data[c].name]; 
          custom_form[c] = form_data[c]; 
          break; 
         } 
        } 
       } 
      } 
      if (validations(custom_form, $('form'), $(this), 'right') != false) { 
       e.preventDefault(); 
       $('#signup_tabs_group a[href="#website"]').tab('show'); 
       return true; 
      } 
      return false; 
     }); 
     $("#back_to_website").click(function (e) { 
      e.preventDefault(); 
      $('#signup_tabs_group a[href="#contact"]').tab('show'); 
     }); 
     $('input[name=account_type]').change(function() { 
      if ($('input[name=account_type]:checked').val() == 'company') { 
       $('.company-label').removeClass('hidden'); 
      } else { 
       $('.company-label').addClass('hidden'); 
       $('#company_name').val(''); 
       if ($('#company_name').hasClass('mypopover')) { 
        $('#company_name').popover('hide'); 
        $('#company_name').popover('disable'); 
       } 
      } 
     }); 
     // jQuery International Telephone Input With Flags and Dial Codes 
     $("#phone_code").intlTelInput({ 
      defaultCountry: "gb" 
     }); 

     //Validation 
     $(".validate_button").click(function(e){ 
      var words = $('#description').val().split(/\b[\s,\.-:;]*/); 
      if (words.length > 100) { 
       words.splice(100); 
       $('#description').val(words.join(" ")); 
      } 
      var custom_form3 = []; 
      var required_elements = ['website_name', 'website_url', 'unique_visitors', 'audience_geo', 'audience_interests', 'website_content', 'advertising_type', 'other_affiliate_member', 'working_with_qs', 'description', 'hear_about_us', 'accept_terms']; 
      for (var c = 0; c < form_data.length; c++) { 
       if (typeof(form_data[c]) != "undefined" && typeof(form_data[c].name) != "undefined" && required_elements.indexOf(form_data[c].name) != -1) { 
        custom_form3[c] = form_data[c]; 
       } 
      } 
      if (validations(custom_form3, $('form'), $(this), 'right') != false) { 
       return true; 
      } 

我如何展示令人耳目一新頁之後表單域？

Answer 1

它相當純粹的JS/jQuery問題比ZF2相關。

我解決這樣這個問題：

$(function(){ 
    var url = document.location.toString(); 
    if (url.match('#')) { 
     $('.nav-tabs a[href=#'+url.split('#')[1]+']').tab('show') ; 
    } 
    $('.nav-tabs a').on('shown.bs.tab', function (e) { 
     window.location.hash = e.target.hash; 
    }); 
}); 

我正在尋找這「一」元素的href與哈希從網址結束選項卡，然後我告訴他們。當有人點擊選項卡時，我也在窗口url哈希組件中設置了一個窗口，以便在有人刷新頁面之後，它會爲他提供上次查看選項卡。