Bootstrap 3 - TABS - Radio Button Group
by bizamajig
HTML
<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css">
<script src="http://getbootstrap.com/dist/js/bootstrap.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css">
<div id="content">
<ul id="tabs" class="nav nav-tabs" data-tabs="tabs">
<li class="active"><a href="#hr" data-toggle="tab">HR</a></li>
<li><a href="#budget" data-toggle="tab">Budegt</a></li>
<li><a href="#instructor" data-toggle="tab">Instructor</a></li>
</ul>
<div id="my-tab-content" class="tab-content">
<div class="tab-pane" id="hr">
<h1>HR Page</h1>
<p>here goes the HR page content</p>
</div>
<div class="tab-pane" id="budget">
<h1>Budget Page</h1>
<p>here goes all budget related information</p>
</div>
<div class="tab-pane" id="instructor">
<h1>Instructor Page</h1>
<p>here goes the home page content</p>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-3"></div>
<div class="col-sm-9">
<div >
<label >
<input type="radio" id="q128" name="quality[21]" value="1" /> New Hire
</label>
<div>
<div>
<label >
<input type="radio" id="q129" name="quality[21]" checked="checked" value="2" /> Existing
</label>
<div>
<br>
<br>
<input type="button" id="button" value="Add New Appointment"></input>
<br>
<br>
<br>Dept : <input type="text" name="quantity" id="quantity" /> * <span id="errmsg"></span>
<br>
<br>UIN : <input type="text" name="quantity" id="quantity" /> * <span id="errmsg"></span>
<br>
<br>
<br>
<input type="button" id="button" value="Search"></input>
<br>
<br>First Name : <input type="text" name="quantity" id="quantity" /> * <span id="errmsg"></span>
<br>
<br>last Name : <input type="text" name="quantity" id="quantity" /> * <span id="errmsg"></span>
<br>
<br>UIN : <input...