        
        <!-- Title Section -->
        <div class="title-section module">
            <div class="row">
        
                <div class="small-12 columns">
                    <h1>Check Out</h1>
                </div><!-- Top Row /-->
        
                <div class="small-12 columns">
                    <ul class="breadcrumbs">
                        <li><a href="#">Home</a></li>
                        <!--<li><a href="#">Features</a></li>-->
                        <!--<li class="disabled">Gene Splicing</li>-->
                        <li><span class="show-for-sr">Current: </span> Check Out</li>
                    </ul><!-- Breadcrumbs /-->
                </div><!-- Bottom Row /-->
                
            </div><!-- Row /-->
        </div>
        <!-- Title Section Ends /-->
        
        <!-- Content section -->
        <div class="content-section module blog-page">
        	
            <div class="row">
            	<div class="medium-2 small-12 columns sidebar">
                    <div class="widget">
                        <h2>My Profile</h2>
                        
                        <ul class="menu vertical">
                            <li><a href="myOrders.php">My Orders</a></li>
							<li class="active"><a href="#">Check Out</a></li>
                            <li><a href="checkIn.php">Check In</a></li>
						<!--	<li><a href="reservedList.php">Reserved List</a></li> -->
							<li><a href="accountDetails.php">Account Details</a></li>
                        </ul>
                    </div><!-- widget ends /-->
                    
                    <!-- widget ends /-->
                    
                    <!-- widget ends /-->
                    
                    <!-- widget ends /-->
                    
                </div><!-- left bar ends here /-->
                <div class="medium-10 small-12 columns posts-wrap">

                    <div class="blog-post">
                        <form name="date_form" method="post" id="date_form" class="form-horizontal">
						<input type="hidden" name="hdAction" id="hdAction">
						<div class="row">
						<div class="form-group">
							   <label class="medium-2 small-12 columns" style="text-align:left; ">From Date:</label>
							   <div class="medium-3 small-12 columns" id="errauthorName"> <input type="date"  id="f_date2"  name="f_date2" class="form-control" maxlength="19" value="{$smarty.post.f_date2}" autocomplete="off" style="color: #000000;" ></div>
							   <label class="medium-2 small-12 columns" style="text-align:left; ">To Date:</label>
							   <div class="medium-3 small-12 columns" id="errbookName"><input type="date"  id="t_date2"  name="t_date2" class="form-control" maxlength="19" value="{$smarty.post.t_date2}" autocomplete="off" style="color: #000000;" ></div>
							  <div class="col-md-2"> 
							  <!--<button id="corder" name="corder" class="button primary" onclick="validateFields();">List</button>-->
							   <input type="button" class="button primary" id="corder" name="corder" value="List" onclick="validateFields();"/>
							  </div>
							  </div>
							  </div>
							
							  <h5 class="theme-color" align="justify">Member Code: {$smarty.session.MemberCode}</h5>
							   <!--<label class="medium-2 small-12 columns" style="text-align:left; ">Member Code: {$smarty.session.User_ID}</label>-->
							  
							  &nbsp; 
					<table class="table table-bordered table-hover  dataTables-example" style="font-size:14px;" border="1" bordercolor="#FFFFFF" cellspacing="3" cellpadding="2">
                    <thead  style="background-color:#174873; color:#FFFFFF;">
                    <tr>
						<th class="slNo">Sl No.</th>
						 <!--<th>Book ID</th>
                        <th>Member Code</th>-->
                        <th>Book Name</th>
						<th>Author Name</th>
                        <th class="readCh">Reading Charge</th>
						  <th class="checkOut">Check out Date</th>
						  <!--<th>Total Charge</th>
						<th>Order Date</th>-->
						<th class="expect">Expected Check in Date</th>	
						<!--<th>Action</th>-->
                    </tr>
                    </thead>
					
                    <tbody>
					{foreach from=$CheckoutDetails item=ListDet}
				
					
					 {assign var=bid value="`$ListDet.book_id`"}
					
                  <tr class="gradeX" id="{$i++}">
			<td>{$i}</td>			
			<!--<td><a  href="./bookDetails.php?order_id={$ListDet.order_id}">{$ListDet.book_id}</a></td>			
		  	<td><a  href="./bookDetails.php?order_id={$ListDet.order_id}">{$smarty.session.User_ID}</a></td>	-->		        
		    <td>{$ListDet.book_name}</td>
		    <td>{$ListDet.author}</td>
		    <td>{$ListDet.reading_charge}</td>
		    <td>{$ListDet.check_out_date}</td>
		    <td>{$ListDet.expected_check_in_date}</td>
           <!-- <td><a  href="./bookDetails.php?order_id={$ListDet.order_id}">{$ListDet.date_of_order}</a></td>		
			<td><a  href="./bookDetails.php?order_id={$ListDet.order_id}">{$ListDet.order_status}</a></td>	-->
<!--			<td><a  href="./bookDetails.php?order_id={$ListDet.order_id}">Accept</a></td>			-->
                  </tr>
				  {foreachelse}
			<tr>
			<td height="20" colspan="6" align="center"><img src="images/warning.gif" border="0">&nbsp;<h5 style="color:#FF0000">NO Records Found...</h5></td>
			</tr>
					{/foreach}	
                    </tbody>
                  
                    </table>
					  </form>
					  <!-- post content ends /-->
 </div>
                    
                      <div class="pagination-container">
		           		      <table width="100%" border="0" cellspacing=1 cellpadding=2>
            					<tr>
            				    <td colspan="2" align="center">{$LinkPage}{$PerPageNavigation}</td>
            				    </tr>
            				    </table>
		           	 </div>
                 
                    
                </div><!-- Posts wrap /-->
                
                
                
            </div><!-- Row Ends /-->
            
        </div>
       
        
    </div>
    <!-- Main Container /-->
	
    <a href="#top" id="top" class="animated fadeInUp start-anim"><i class="fa fa-angle-up"></i></a>
{literal}
    <!-- Including Jquery so All js Can run -->
    <script type="text/javascript" src="js/jquery.js"></script>
    
    <!-- Including Foundation JS so Foundation function can work. -->
    <script type="text/javascript" src="js/foundation.min.js"></script>
    
    <!-- Including Owl Carousel File -->
    <script type="text/javascript" src="js/owl.carousel.min.js"></script>
    
    <!-- Webful JS -->
		<script type="text/javascript">
    function validateFields() {
	var f_date2=$('#f_date2').val();
	var t_date2=$('#t_date2').val();
   
	$(".error").remove();
	if(f_date2=="")
	{
	$('#f_date2').after('<span class="error">This field is required</span>');
	
	$('#f_date2').focus();
	
	return false;	
	}
	if(t_date2 =="")
	{
	$('#t_date2').after('<span class="error">This field is required</span>');
	
	$('#t_date2').focus();
	
	return false;	
	}	
	FormName= document.date_form;
    FormName.method= "POST";
  FormName.submit();
}
}
   
 
</script>
<style>
.slNo{
width:6%;
}
.readCh{
width:15%;
}
.checkOut{
width:15%;
}
.expect{
width:20%;
}
.table tr:nth-child(even){background-color: #FFFFFF;}
.isa_success

{

color: #FFFFFF;

background-color: #174873;

}

.error

{

color:#D8000C;

/*background-color:#FFBABA;*/

}

.isa_error

{

color:#D8000C;

background-color:#FFBABA;

}

.isa_success i,.isa_error i

{

margin:10px 22px;

font-size:2em;

/*vertical-align:middle;*/

}

.required

{

color:#FF0000;
float:right;

}

</style>	
	
{/literal}
</body>
</html>
