JSFiddle - React, Tailwind, and code Playground

by Karen Maritz

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script>
<script src="https://rawgithub.com/ianserlin/bootstrap-datepicker/3.x/js/bootstrap-datepicker.js"></script>
<div class="container">
        <div class="page-header">
          <h1>eBusiness</h1>
        </div>
        
  
    <form name="AgentInfoForm"class="form-horizontal" >
    
		<div class="row">
			<div class="col-xs-12">
						<div class="panel panel-primary">
							 <div class="panel-heading"><h3 class="panel-title">Application Source</h3></div>
							 
						</div><!--  End of panel  -->		
							
							<div class="panel panel-primary">
							 <div class="panel-heading"><h3 class="panel-title">Type Of Payment(s)</h3></div>
							 <div class="panel-body">
								<div class ="form-group-inline">
										<label class="col-sm-2 control-label" >Check(s)</label>		
										<div class="col-sm-1">    
											<input  class="text-input form-control" type="text" name="nuOfChecks" id="nuOfChecks" />											
										</div>
								</div>						
						
										<div class ="form-group-inline">
											<label class="col-sm-2 control-label" >EFT(s)</label>		
											<div class="col-sm-1">    
												<input  class="text-input form-control" type="text" name="nuOfEFTs" id="nuOfEFTs" />											
											</div>											
										</div>
									<div class ="form-group-inline">
											<label class="col-sm-2 control-label" >Credit Card(s)</label>		
											<div class="col-sm-1">    
												<input  class="text-input form-control" type="text" name="nuOfCCs" id="nuOfCCs" />											
											</div>											
									</div>
								
									<div class ="form-group-inline">
											<label class="col-sm-2 control-label" >Application(s)</label>		
											<div class="col-sm-1">    
												<input  class="text-input form-control"...

CSS

.datepicker { cursor: pointer; }

JavaScript

$(document).ready(function() {

$('#ARDT').datepicker();

    /*disable non active tabs*/
    $('.nav li').not('.active').addClass('disabled');
    $('.nav li').not('.active').find('a').removeAttr("data-toggle");
    
    $('button').click(function(){
        /*enable next tab*/
        $('.nav li.active').next('li').removeClass('disabled');
        $('.nav li.active').next('li').find('a').attr("data-toggle","tab")
    });
});