Edit in JSFiddle

// all tabe panes visible (in)
// we only toggle their contents

// trigger via nav-tabs or tab panel-title

// 3 things to update
// 1) nav-tabs li > .active
// 2) tab-pane panel-heading > .active
// 2) tab-pane panel-body > collapse (.in)

$('.panel-group').on('click', '.nav-tabs li', function (e) {
  var $navItem = $(this);
  var $tabPane = $($(this).find('a').data('target'));
  var $panelGrp = $(this).closest('.panel-group');

  updatePanelGroup($navItem, $tabPane, $panelGrp);
});


$('.panel-group').on('click', '.tab-content .panel-title', function (e) {
  var $panelGrp = $(this).closest('.panel-group');
  var $tabPane = $(this).closest('.tab-pane');
  var href = $tabPane.attr('id');
  var $navItem = $tabPane.closest('.panel-group').find('.nav-tabs a[data-target="#' + href + '"]').closest('li')

  updatePanelGroup($navItem, $tabPane, $panelGrp);

});


$('.panel-group .panel-group-toggle').on('click', function (e) {
  var $toggler = $(this);
  var $tabPanes = $toggler.closest('.panel-group').find('.tab-pane');
  var $navItems = $toggler.closest('.panel-group').find('.nav-tabs li');

  if ($toggler.hasClass('all-visible')) {
    // if everything is visible, then collapse everything
    $navItems.removeClass('active');
    $tabPanes.find('.panel-title').removeClass('active');
    $tabPanes.find('.panel-body').collapse('hide');

  } else {
    // otherwise we'll show everything
    $navItems.addClass('active');
    $tabPanes.find('.panel-title').addClass('active');
    $tabPanes.find('.panel-body').collapse('show');
  }
  $toggler.toggleClass('all-visible');
  return false;
}).click();


// tab back into prev pane
var firstPanelInputs = $(".panel").map(function(){ 
		var firstInput = $(this).find(":input:first")
	return firstInput.length > 0 ? firstInput[0] : null
}).get();
$(firstPanelInputs).keydown(function (e) {
  // did we hit tab
  if (e.which === 9 && event.shiftKey) {
    // leaving last item in panel, make sure next one is open

    var $panelGrp = $(this).closest('.panel-group');
    var $prevTabPane = $(this).closest('.tab-pane').prev('.tab-pane');
    var href = $prevTabPane.attr('id')
    var $prevNavItem = $prevTabPane.closest('.panel-group').find('.nav-tabs a[data-target="#' + href + '"]').closest('li')

    activatePanelGroup($prevNavItem, $prevTabPane, $panelGrp)
  }

});

// tab into next pane
var lastPanelInputs = $(".panel").map(function(){ 
	var lastInput = $(this).find(":input:last")
	return lastInput.length > 0 ? lastInput[0] : null
}).get();
$(lastPanelInputs).keydown(function (e) {
  // did we hit tab
  if (e.which === 9 && !event.shiftKey) {
    // leaving last item in panel, make sure next one is open

    var $panelGrp = $(this).closest('.panel-group');
    var $nextTabPane = $(this).closest('.tab-pane').next('.tab-pane');
    var href = $nextTabPane.attr('id');
    var $nextNavItem = $nextTabPane.closest('.panel-group').find('.nav-tabs a[data-target="#' + href + '"]').closest('li');

    activatePanelGroup($nextNavItem, $nextTabPane, $panelGrp);

  }

});


function activatePanelGroup($navItem, $tabPane, $panelGrp) {
  $navItem.addClass('active');
  $tabPane.find('.panel-title').addClass('active');
  $tabPane.find('.panel-body').collapse('show');

  setToggleDirection($panelGrp);
}

function updatePanelGroup($navItem, $tabPane, $panelGrp) {
  $navItem.toggleClass('active');
  $tabPane.find('.panel-title').toggleClass('active');
  $tabPane.find('.panel-body').collapse('toggle');

  setToggleDirection($panelGrp);
}

function setToggleDirection($panelGrp) {
  var $toggler = $panelGrp.find(".panel-group-toggle");
  var $navItems = $panelGrp.find(".nav-tabs li");
  var allActive = $navItems.length === $navItems.filter(".active").length;
  $toggler.toggleClass('all-visible', allActive);
}
<h3>Panel Group Demo</h3>

<div class="panel-group">
  <div class="panel-group-header" data-spy="affix" data-offset-top="60" >
    <ul class="nav nav-tabs" >
      <li style="margin-top:7px;">  
        <button class="btn btn-default panel-group-toggle btn-sm">
          <span class="toggle-show"><span class="fa fa-toggle-off fa-fw"></span> Show All</span>
          <span class="toggle-hide"><span class="fa fa-toggle-on fa-fw"></span> Hide All</span>
        </button>
      </li>
      <li class="active"><a href="javascript:void(0);" data-target="#profile">Profile</a></li>
      <li><a href="javascript:void(0);" data-target="#level">Level</a></li>
      <li><a href="javascript:void(0);" data-target="#services">Services</a></li>
      <li><a href="javascript:void(0);" data-target="#diagnoses">Diagnoses</a></li>
      <li><a href="javascript:void(0);" data-target="#address">Address</a></li>
      <li><a href="javascript:void(0);" data-target="#adopted">Adopted</a></li>
      <li><a href="javascript:void(0);" data-target="#cultural">Cultural</a></li>
      <li><a href="javascript:void(0);" data-target="#economic">Economic</a></li>
      <li><a href="javascript:void(0);" data-target="#insurance">Insurance</a></li>
    </ul>
  </div>
  <div class="tab-content">

    <div class="tab-pane in" id="profile">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title active">Profile</h3>
        </div>
        <div class="panel-body collapse in">

          Profile Body <input type="text"> <input type="text">

        </div>
      </div>
    </div>

    <div class="tab-pane in" id="level">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title">Level</h3>
        </div>
        <div class="panel-body collapse ">
          Level Body <input type="text"> <input type="text">
        </div>
      </div>
    </div>

    <div class="tab-pane in" id="services">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title">Services</h3>
        </div>
        <div class="panel-body collapse">
          Services Body <input type="text"> <input type="text">
        </div>
      </div>
    </div>

    <div class="tab-pane in" id="diagnoses">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title">Diagnoses</h3>
        </div>
        <div class="panel-body collapse">
          Diagnoses Body <input type="text"> <input type="text">
        </div>
      </div>
    </div>

    <div class="tab-pane in" id="address">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title">Address</h3>
        </div>
        <div class="panel-body collapse">
          Address Body <input type="text"> <input type="text">
        </div>
      </div>
    </div>

    <div class="tab-pane in" id="adopted">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title">Adopted</h3>
        </div>
        <div class="panel-body collapse">
          Adopted Body <input type="text"> <input type="text">
        </div>
      </div>
    </div>

    <div class="tab-pane in" id="cultural">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title">Cultural</h3>
        </div>
        <div class="panel-body collapse">
          Cultural Body <input type="text"> <input type="text">
        </div>
      </div>
    </div>

    <div class="tab-pane in" id="economic">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title">Economic</h3>
        </div>
        <div class="panel-body collapse">
          Economic Body <input type="text"> <input type="text">
        </div>
      </div>
    </div>

    <div class="tab-pane in" id="insurance">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h3 class="panel-title">Insurance</h3>
        </div>
        <div class="panel-body collapse">
          Insurance Body  <input type="text"> <input type="text">
        </div>
      </div>
    </div>


  </div>
</div>

<button name="submit" value="save" type="submit" class="btn btn-primary">
  <span class="fa fa-save"></span>
  Save
</button>
body {
  margin: 15px;
}

.tab-content > .tab-pane.in {
  display: block;
}

.panel-group-toggle .toggle-show {
  display: block;
}

.panel-group-toggle .toggle-hide {
  display: none;
}

.panel-group-toggle.all-visible .toggle-show {
  display: none;
}

.panel-group-toggle.all-visible .toggle-hide {
  display: block;
}

.panel-title:hover {
  cursor: pointer;
}

.panel-group .tab-pane {
  margin-bottom: 2.5px;
}

.panel-heading .panel-title:after {
  font-family: 'Glyphicons Halflings';
  content: "\2b";
  float: right;
  color: grey;
}

.panel-heading .panel-title.active:after {
  content: "\2212";
}
.panel-heading .panel-title:after {
  font-family: 'Glyphicons Halflings';
  content: "\2b";
  float: right;
  color: grey;
}

.panel-heading .panel-title.active:after {
  content: "\2212";
}

.panel-group .panel-group-header {
  background: white;
  padding-top: 10px;
  width: 100%;
}
.panel-group .panel-group-header.affix {
  position: fixed;
  top: 0px;
  z-index: 99;
  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}
.panel-group .panel-group-header.affix + .tab-content {
  margin-top: 95px;
}