jerrylee · February 20, 2015 19:33
diff --git a/Tab Tool b/Tab Tool
 <?php
 /*
 Easy to use Tabs maker for Bootsrap 3
 */

 $tabone = $_POST['tabone'];
 $tabtwo = $_POST['tabtwo'];
 $tabthree = $_POST['tabthree'];
 $tabfour = $_POST['tabfour'];
 $tabcontentone = $_POST['tabcontentone'];
 $tabcontenttwo = $_POST['tabcontenttwo'];
 $tabcontentthree = $_POST['tabcontentthree'];
 $tabcontentfour = $_POST['tabcontentfour'];

 ?>

 <!DOCTYPE html>
 <html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

    <style>
   h1, h2, h3, h4, h5, h6, p{
      font-size:12px;
    }
    body {
      background-color:#ddd;
    }
    .main-wrapper {
      margin-top:5%;
      margin-bottom:5%;
      background-color:#fff;
      min-height:500px;
      padding:20px;
    }
    .tab-content {
      padding:10px 20px;
    }
    .margin-top {
      margin-top:30px;
    }
    </style>
  </head>
  <body>






 <div class="container main-wrapper">

  <div class="row form">
    <form action="" method="post">
    <h3>Tab One</h3>
    <input type="text" name="tabone" placeholder="Tab One Text"><br />
    <h3>Tab Content One</h3>
    <textarea name="tabcontentone" id="tabcontentone" cols="100" rows="10"></textarea><br /> <hr />

    <h3>Tab Two</h3>
    <input type="text" name="tabtwo" placeholder="Tab Two Text"><br />
    <h3>Tab Content Two</h3>
    <textarea name="tabcontenttwo" id="tabcontenttwo" cols="100" rows="10"></textarea><br /> <hr />
    


    <h3>Tab Three</h3>
    <input type="text" name="tabthree" placeholder="Tab Three Text"><br />
    <h3>Tab Content Three</h3>
    <textarea name="tabcontentthree" id="tabcontentthree" cols="100" rows="10"></textarea><br /> <hr />

    <input type="submit" name="submit" />
    </form>
  </div>


  <?php if(isset($_POST['submit'])) { ?>
 <div class="row margin-top">
      <div role="tabpanel">

    <!-- Nav tabs -->
    <ul class="nav nav-tabs" role="tablist">
      <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">
        <?php printf("$tabone"); ?>
      </a></li>
      <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">
        <?php printf("$tabtwo"); ?>
      </a></li>
      <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">
        <?php printf("$tabthree"); ?>
      </a></li>
      <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">
        <?php printf("$tabfour"); ?>
      </a></li>
    </ul>

    <!-- Tab panes -->
    <div class="tab-content">
      <div role="tabpanel" class="tab-pane active" id="home">
        <?php printf("$tabcontentone"); ?>
      </div>
      <div role="tabpanel" class="tab-pane" id="profile">
        <?php printf("$tabcontenttwo"); ?>
      </div>
      <div role="tabpanel" class="tab-pane" id="messages">
        <?php printf("$tabcontentthree"); ?>
      </div>
      <div role="tabpanel" class="tab-pane" id="settings">
        <?php printf("$tabcontentfour"); ?>
      </div>
    </div>
  </div><!-- /tab panel -->
  </div><!-- /row (final) -->

 <?php } ?>

 </div><!-- /container -->






    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
  </body>
 </html>
	<?php
	/*
	Easy to use Tabs maker for Bootsrap 3
	*/

	$tabone = $_POST['tabone'];
	$tabtwo = $_POST['tabtwo'];
	$tabthree = $_POST['tabthree'];
	$tabfour = $_POST['tabfour'];
	$tabcontentone = $_POST['tabcontentone'];
	$tabcontenttwo = $_POST['tabcontenttwo'];
	$tabcontentthree = $_POST['tabcontentthree'];
	$tabcontentfour = $_POST['tabcontentfour'];

	?>

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Bootstrap 101 Template</title>

	<!-- Bootstrap -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->

	<style>
	h1, h2, h3, h4, h5, h6, p{
	font-size:12px;
	}
	body {
	background-color:#ddd;
	}
	.main-wrapper {
	margin-top:5%;
	margin-bottom:5%;
	background-color:#fff;
	min-height:500px;
	padding:20px;
	}
	.tab-content {
	padding:10px 20px;
	}
	.margin-top {
	margin-top:30px;
	}
	</style>
	</head>
	<body>






	<div class="container main-wrapper">

	<div class="row form">
	<form action="" method="post">
	<h3>Tab One</h3>
	<input type="text" name="tabone" placeholder="Tab One Text"><br />
	<h3>Tab Content One</h3>
	<textarea name="tabcontentone" id="tabcontentone" cols="100" rows="10"></textarea><br /> <hr />

	<h3>Tab Two</h3>
	<input type="text" name="tabtwo" placeholder="Tab Two Text"><br />
	<h3>Tab Content Two</h3>
	<textarea name="tabcontenttwo" id="tabcontenttwo" cols="100" rows="10"></textarea><br /> <hr />



	<h3>Tab Three</h3>
	<input type="text" name="tabthree" placeholder="Tab Three Text"><br />
	<h3>Tab Content Three</h3>
	<textarea name="tabcontentthree" id="tabcontentthree" cols="100" rows="10"></textarea><br /> <hr />

	<input type="submit" name="submit" />
	</form>
	</div>


	<?php if(isset($_POST['submit'])) { ?>
	<div class="row margin-top">
	<div role="tabpanel">

	<!-- Nav tabs -->
	<ul class="nav nav-tabs" role="tablist">
	<li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">
	<?php printf("$tabone"); ?>
	</a></li>
	<li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">
	<?php printf("$tabtwo"); ?>
	</a></li>
	<li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">
	<?php printf("$tabthree"); ?>
	</a></li>
	<li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">
	<?php printf("$tabfour"); ?>
	</a></li>
	</ul>

	<!-- Tab panes -->
	<div class="tab-content">
	<div role="tabpanel" class="tab-pane active" id="home">
	<?php printf("$tabcontentone"); ?>
	</div>
	<div role="tabpanel" class="tab-pane" id="profile">
	<?php printf("$tabcontenttwo"); ?>
	</div>
	<div role="tabpanel" class="tab-pane" id="messages">
	<?php printf("$tabcontentthree"); ?>
	</div>
	<div role="tabpanel" class="tab-pane" id="settings">
	<?php printf("$tabcontentfour"); ?>
	</div>
	</div>
	</div><!-- /tab panel -->
	</div><!-- /row (final) -->

	<?php } ?>

	</div><!-- /container -->






	<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
	<!-- Include all compiled plugins (below), or include individual files as needed -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
	</body>
	</html>