<div>
    <h3 class="rs alternate-tab accordion-label">Cats <i class="fa fa-caret-down" style="float:right; margin:3px 5px 0 5px;"></i></h3>
    <div class="tab-pane accordion-content<?= $active_usersact ?>">
        <div class="form form-profile aif jet" style='width:auto'>
                <ul class="subtabs-list" style="border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;">
                    <li class="active"><a href="#trips-tab">Blog</a></li>
                    <li><a href="#seats-tab">Shop</a></li>
                    <li><a href="#planes-tab">Cat #3</a></li>
                    <li><a href="#carriers-tab">Cat #4</a></li>
                    <li><a href="#import-tab">Cat #5</a></li>
                    <div class="clear"></div>
                </ul>
                <div class="clear"></div>   

				<!-- ################################# -->
				<!-- #########  SUB-TAB #1   ######### -->
				<!-- ################################# -->
				
                <div id="trips-tab" class="subtab active">
                    <h2>Blog</h2>
					
				</div>	
					
                <!-- END OF SUB-TAB #1 -->				
 
				<!-- ################################# -->
				<!-- #########  SUB-TAB #2   ######### -->
				<!-- ################################# -->
 
                <div id="seats-tab" class="subtab">
                    <h2>Shop</h2>
                    <table>
                        <tr>
                            <th>Make</th><th>Model</th><th>Seats</th><th>Carrier</th><th>Actions</th>
                        </tr>
                        <?php
                          
                        foreach ($jet_planes as $row) {
                            echo "<tr><td>{$row['make']}</td><td>{$row['model']}</td><td>{$row['seats']}</td><td></td>
                                <td>
                                    <a href='?jet&deletePlane={$row['id']}'>Delete</a>
                                </td>
                            </tr>";
                        }
                        
                        ?>
                    </table>
                    
                    <div id="add_plane" style="display:none">
                        <!-- Add Plane Form -->
                        <form method="post" class="form form-profile">
                            <input type="hidden" name="jet" value="add_plane" />
                			<div class="row-item">
                				<label class="lbl">Make:</label>
                                <div class="val"><input class="txt" type="text" name="make"></div>			
                			</div>
                			<div class="row-item">                
                                <label class="lbl">Model:</label>
                                <div class="val"><input class="txt" type="text" name="model"></div>			
                            </div>
                			<div class="row-item">                
                                <label class="lbl">Seats:</label>
                                <div class="val"><input class="txt" type="text" name="seats"></div>			
                            </div>
                			<div class="row-item">                
                                <label class="lbl">Tail Number:</label>
                                <div class="val"><input class="txt" type="text" name="tailno"></div>			
                            </div>
                			<div class="row-item">                
                                <label class="lbl">Carrier:</label>
                                <div class="val">
                                    <select name="carrier_id" class="txt">
                                        <option value=""> - Please Select - </option>
                                        <?php
                                        foreach ($jet_carriers as $carrier) {
                                            echo "<option value='{$carrier['id']}'>{$carrier['name']}</option>";
                                        }
                                        ?>
                                    </select>
                                </div>			
                            </div>
                            <br>
                            <input type="submit" style="font-weight:300" class="btn btn-blue"> 
<!--                 			<input type="button" value="Cancel" class="btn btn-black" onclick="location = '/admin/'"> -->
                		</form>
                    </div>
                    
                    <a href="#add_plane" class="show">Add</a>
                </div>
                <!-- END OF SUB-TAB #2 -->
				
				<!-- ################################# -->
				<!-- #########  SUB-TAB #3   ######### -->
				<!-- ################################# -->				
                
                <div id="planes-tab" class="subtab">
                    <h2>Cat #3</h2>                  
                    
                </div>
                <!-- END OF SUB-TAB #3 -->                             
 
				<!-- ################################# -->
				<!-- #########  SUB-TAB #4   ######### -->
				<!-- ################################# -->	
 
                <div id="carriers-tab" class="subtab">
                    <h2>Cat #4</h2>                  
                    
                </div>
                <!-- END OF SUB-TAB #4 -->				                

				<!-- ################################# -->
				<!-- #########  SUB-TAB #5   ######### -->
				<!-- ################################# -->	
				
                <div id="import-tab" class="subtab">
                  <h2>Cat #5</h2>      
                </div>
                <!-- END OF SUB-TAB #4 -->					
                
            <div id="viewTrip" style="display:none">
                <div class="ajaxContent jet" style="background-color:white; padding:20px 30px; font-size:16px;">
                
                </div>
            </div>
        </div>
    </div><!--end: .tab-pane -->
</div>

<script>
$('.viewJetTrip').fancybox();

$('.viewJetTrip').click(function () {
   $.ajax({
       url: $(this).attr('ajaxURL'),
       success: function (data) {
           $('#viewTrip .ajaxContent').html(data);
           $.fancybox.update()
       }
   }) 
});

$('.show').click(function (e) {
   e.preventDefault();
   var sel = $(this).attr('href');
   $(sel).show();
   $(this).hide();
});

$( ".datepicker" ).datepicker();
</script>

<style>
.jet .row-item {
    padding-bottom: 8px;
}
.jet td, .jet th {
    padding: 5px;
}
</style>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">