Динамические закладки бутстрапа с использованием PHP / MySQL

Хорошо, поэтому я думаю, что проблема заключается в том, как вы устанавливаете свой идентификатор .tab-панели. Прямо сейчас нет «эха», поэтому там ничего не выводится.

Я собрал рабочую демоверсию, я изменил часть кода, но очень незначительные вещи, которые я пытался прокомментировать:

 <!-- START OF YOUR CODE --> <ul class="nav nav-tabs" id="lb-tabs"> <?php // I just made an array with some data, since I don't have your data source $sqlCat = array( array('tab_title'=>'Home'), array('tab_title'=>'Profile'), array('tab_title'=>'Messages'), array('tab_title'=>'Settings') ); //set the current tab to be the first one in the list.... or whatever one you specify $current_tab = $sqlCat[0]['tab_title']; ?> <?php foreach ($sqlCat as $row): //set the class to "active" for the active tab. $tab_class = ($row['tab_title']==$current_tab) ? 'active' : '' ; echo '<li class="'.$tab_class.'"><a href="#' . urlencode($row['tab_title']) . '" data-toggle="tab">' . $row['tab_title'] . ' </a></li>'; endforeach; ?> </ul><!-- /nav-tabs --> <div class="tab-content"> <?php foreach ($sqlCat as $row2): $tab = $row2['tab_title']; //set the class to "active" for the active content. $content_class = ($tab==$current_tab) ? 'active' : '' ; ?> <div class="tab-pane <?php echo $content_class;?>" id="<?php echo $tab; //-- this right here is from yoru code, but there was no "echo" ?>"> <div class="links"> <ul class="col"> <?php // Again, I just made an array with some data, since I don't have your data source $items = array( array('title'=>'Home','tab_link'=>'http://home.com'), array('title'=>'Profile','tab_link'=>'http://profile.com'), array('title'=>'Messages','tab_link'=>'http://messages.com'), array('title'=>'Settings','tab_link'=>'http://settings.com'), array('title'=>'Profile','tab_link'=>'http://profile2.com'), array('title'=>'Profile','tab_link'=>'http://profile3.com'), ); // you have a while loop here, my array doesn't have a "fetch" method, so I use a foreach loop here foreach($items as $item) { //output the links with the title that matches this content's tab. if($item['title'] == $tab){ echo '<li>' . $item['title'] . ' - '. $item['tab_link'] .'</li>'; } } ?> </ul> </div> </div><!-- /tab-pane --> <?php endforeach; ?> </div><!-- /tab-content --> <!-- END OF YOUR CODE --> 

Это очень помогает мне. У меня есть две статические вкладки для создания контента, которые управляют динамическими вкладками. Это определенно все еще немного грубо, но, по крайней мере, концепция работает.

 <ul class="nav nav-tabs"> <li class="active"><a href="#tab1" data-toggle="tab">Clusters</a></li> <li><a href="#tab2" data-toggle="tab">Activities</a></li> <?php $sql = "<insert query here>"; $stmt = sqlsrv_query( $conn, $sql ); if( $stmt === false) { die( print_r( sqlsrv_errors(), true) ); } while( $rowtab = sqlsrv_fetch_array( $stmt, SQLSRV_FETCH_ASSOC) ) { $tab_class = ($rowtab['tab_title']==$current_tab) ? 'active' : '' ; $nospaces = str_replace(' ', '', $rowtab['tab_title']); echo '<li class="'.$tab_class.'"><a href="#' . urlencode($nospaces) . '" data-toggle="tab">' . $rowtab['tab_title'] . '</a></li>'; } ?> </ul> <div class="tab-content"> <div class="tab-pane active" id="tab1"> Tab1 Content </div> <div class="tab-pane" id="tab2"> Tab2 Content </div> <?php $sql = "<insert query here>"; $stmt = sqlsrv_query( $conn, $sql ); if( $stmt === false) { die( print_r( sqlsrv_errors(), true) ); } while( $rowtab = sqlsrv_fetch_array( $stmt, SQLSRV_FETCH_ASSOC) ) { $tab = $rowtab['tab_title']; $nospaces = str_replace(' ', '', $rowtab['tab_title']); $content_class = ($tab==$current_tab) ? 'active' : '' ; echo '<div class="tab-pane'. $content_class.'" id="'.$nospaces.'">'; echo 'You are looking at the '.$tab.' tab. Dynamic content will go here.'; echo '</div><!-- /.tab-pane -->'; } ?> </div> 

 foreach ($files as $file): $filename = preg_replace("/\.html$/i", "", $file); $title = preg_replace("/\-/i", " ", $filename); $documentation = 'usage/'.$type.'/'.$file; $tab1 = 'usage/'.$type.'/'.$file; echo '<div class="sg-markup sg-section">'; echo '<div class="sg-display">'; echo '<h2 class="sg-h2"><a id="sg-'.$filename.'" class="sg-anchor">'.$title.'</a></h2>'; //TAb Set up echo '<div class="row"><div class="col-md-12">'; echo '<ul class="nav nav-tabs" role="tablist">'; echo '<li role="presentation" class="active"><a href="#Visual" aria-controls="visual" role="tab" data-toggle="tab">Visual</a></li>'; echo '<li role="presentation"><a href="#Rules" aria-controls="rules" role="tab" data-toggle="tab">Rules</a></li>'; echo '</ul>'; echo '</div>'; echo '</div>'; //Visual Tab Content echo '<div class="row"><div class="col-md-12">'; echo '<div class="tab-content">'; echo '<div role="tabpanel" class="tab-pane active" id="Visual">'; echo '<h3 class="sg-h3">Visual</h3>'; include('markup/'.$type.'/'.$file); //View Source echo '<div class="sg-markup-controls"><a class="btn btn-primary sg-btn sg-btn--source" href="#">View Source</a> <a class="sg-btn--top" href="#top">Back to Top</a> </div>'; echo '<div class="sg-source sg-animated">'; echo '<a class="btn btn-default sg-btn sg-btn--select" href="#">Copy Source</a>'; echo '<pre class="prettyprint linenums"><code>'; echo htmlspecialchars(file_get_contents('markup/'.$type.'/'.$file)); echo '</code></pre>'; echo '</div><!--/.sg-source-->'; echo '</div>'; //Documentation Tab Content if (file_exists($documentation)) { echo '<div role="tabpanel" class="tab-pane" id="Rules">'; echo '<h3 class="sg-h3">Rules</h3>'; include($documentation); //View Source echo '<a class="sg-btn--top" href="#top">Back to Top</a>'; echo '</div>'; } //Documentation Tab1 Content echo '<div role="tabpanel" class="tab-pane" id="Tab1">'; echo '<h3 class="sg-h3">Tab1</h3>'; include($tab1); echo '<a class="sg-btn--top" href="#top">Back to Top</a>'; echo '</div>'; //Documentation Tab2 Content echo '<div role="tabpanel" class="tab-pane" id="Tab2">'; echo '<h3 class="sg-h3">Tab2</h3>'; // include($tab2); echo '<a class="sg-btn--top" href="#top">Back to Top</a>'; echo '</div>'; echo '</div>'; //End Tab Content echo '</div>'; //End Column echo '</div>'; //End Row //echo '<div class="row"><div class="col-md-12">'; //echo '<h3 class="sg-h3">Example</h3>'; //include('markup/'.$type.'/'.$file); //echo '</div>'; // if (file_exists($documentation)) { // echo '<div class="col-md-12"><div class="well sg-doc">'; // echo '<h3 class="sg-h3">Rules</h3>'; // include($documentation); // echo '</div></div></div>'; // } echo '</div><!--/.sg-display-->'; //echo '</div><!--/.colmd10-->'; echo '</div><!--/.sg-section-->'; endforeach; 

}