eims

 <%
 SessionVariable sessionVariable = new SessionVariable();
 Object[] logInInfo = (Object[]) ActionContext.getContext().getSession().get(sessionVariable.getUserLogInInfo());
 String userRollS =logInInfo[6]==null?"":logInInfo[6].toString();
 %>
<script>
 $(document).ready(function(){
    $( "#leave_application_list_table" ).on( "click",".edit_app_List_row", function() {
        var row_val = $( this ).attr('rel');
        var arr = row_val.split('_');
        $('#approved_leave_app_id').val(arr[0]);
        $('#approverDesignationf').val(arr[1].trim());
        //alert(arr[1]);
        $('#appEmpNamef').val(arr[2]);
        $('#appLeaveTypef').val(arr[3]);
        $('#appApvOffForward').val(arr[4]);
        $('#appApliedDatef').val(arr[5]);
        $('#appempContactf').val(arr[6]);
        $('#appStartDatef').val(arr[7]);
        $('#appEndDatef').val(arr[8]);
        $('#appNoDayf').val(arr[9]);
   
        $('#appReasonf').val(arr[11]);
        $('#appAddressf').val(arr[12]);
       
        $('#tabPanelUL a[href="#approvedLeave"]').tab('show');
       
        //$(this).closest('tr').remove();
       
        /*
        if(arr[10]=='Y'){
        $("#appCancell1").prop('checked', true);
        }
        if(arr[10]=='N'){
        $("#appCancell2").prop('checked', true);
        }
        */
       
    });
 });



 </script>
<script>
function countDays(){
var startDate=document.getElementById('appStartDate').value;
var endDate=document.getElementById('appEndDate').value;
   
var dayfield=startDate.split("/")[0];
 var monthfield=startDate.split("/")[1];
 var yearfield=startDate.split("/")[2];

 var date1 = new Date(yearfield, monthfield-1, dayfield);

 var dayfield2=endDate.split("/")[0];
 var monthfield2=endDate.split("/")[1];
 var yearfield2=endDate.split("/")[2];

 var date2 = new Date(yearfield2, monthfield2-1, dayfield2);
 if(endDate== null || endDate==''){
 document.getElementById('appNoDay').value="0";
 }
  var diffDays = parseInt((date2 - date1) / (1000 * 60 * 60 * 24)+1);

  document.getElementById('appNoDay').value=diffDays;





 }



</script>

<script>
 $(document).ready(function(){
    $( "#approved_list_table" ).on( "click",".edit_approved_list_row", function() {
        var row_val = $( this ).attr('rel');
        var arr = row_val.split('_');
        $('#empNameD').val(arr[0]);
         $('#empDesignationD').val(arr[1].trim());
         alert("kaniz"+arr[1]);
         $('#leaveTypeD').val(arr[2]);
         $('#appToNameD').val(arr[3]);
         $('#appDesignationD').val(arr[4]);
         $('#appliedDateD').val(arr[5]);
        $('#startDateD').val(arr[6]);
        $('#endDateD').val(arr[7]);
         $('#noOfDaysD').val(arr[8]);
         $('#leaveCauseD').val(arr[9]);
         $('#addressD').val(arr[10]);
       
        $('#offLeaveType').val(arr[11]);
        //alert(arr[11]);
        $('#approvedByD').val(arr[12]);
        //alert(arr[12]);
        $('#appByDesigD').val(arr[13]);
        //alert(arr[13]);
        $('#appDateD').val(arr[14]);
        //alert(arr[14]);
        $('#offStartDate').val(arr[15]);
        //alert(arr[15]);
        $('#offEndDate').val(arr[16]);
        //alert(arr[16]);
        $('#offComment').val(arr[17]);
        //alert(arr[17]);
       
       
        //$(this).closest('tr').remove();
       
        $('#tabPanelUL a[href="#details"]').tab('show');
        alert("kk"+show);
       
    });
 });



 </script>

 <script>

 $(function(){
    $( "#leaveAppForm" ).submit(function( event ) {
   
        event.preventDefault();
       
        var report=document.getElementById("printReport").checked;
        var form=$("#leaveAppForm").serialize();
        $.ajax({
            async:false,
            type: 'POST',
            data:form,   
            url: "addLeaveAppHrm.do",
            success: function(data){   
               
          $("#containsDiv").html(data);
             if(report==true){
           
            var ajaxURL = "showReptLeaveHrm.do";                   
                window.open(ajaxURL,'_blank');
                }
               
               
            }                   
          });
    });
});
</script>
<script>

 $(function(){
    $( "#approvedForm" ).submit(function( event ) {
   
        event.preventDefault();
        var form=$("#approvedForm").serialize();
        $.ajax({
            async:false,
            type: 'POST',
            data:form,   
            url: "addApprovedAppHrm.do",
            success: function(data){   
               
          $("#containsDiv").html(data);
                       
            }                   
          });
    });
});
</script>
<script>
 function getEmployeeLeave(id) {       
       
        var designationName = document.getElementById(id).value;       
        //alert(designationName);
        var ajaxURL = "showEmployeeLeaveHrm.do?approverdesignation="+designationName;
        $.ajax({
            beforeSend : function() {
            },
            url : ajaxURL,
            success : function(result) {
                $("#EmployeeNameLeaveDiv").html(result);
            }
        });
       
    }

    $(document).ready(function(){
         $('#appApliedDate').datetimepicker({
                    format : 'd/m/Y',
                    closeOnDateSelect : true,
                    timepicker : false
                });
         $('#appApliedDatef').datetimepicker({
                    format : 'd/m/Y',
                    closeOnDateSelect : true,
                    timepicker : false
                });
         $('#appStartDate').datetimepicker({
                    format : 'd/m/Y',
                    maxDate : new Date(),
                    closeOnDateSelect : true,
                    timepicker : false
                });
         $('#appStartDatef').datetimepicker({
                    format : 'd/m/Y',
                    maxDate : new Date(),
                    closeOnDateSelect : true,
                    timepicker : false
                });
         $('#appEndDate').datetimepicker({
                    format : 'd/m/Y',
                    closeOnDateSelect : true,
                    timepicker : false
                });
         $('#appEndDatef').datetimepicker({
                    format : 'd/m/Y',
                    closeOnDateSelect : true,
                    timepicker : false
                });
   
});
 </script>
<style>
$('input[type="checkbox"].style2').checkbox({
    buttonStyle: 'btn-base',
    buttonStyleChecked: 'btn-success',
    checkedClass: 'icon-check',
    uncheckedClass: 'icon-check-empty'
});
</style>
<div id="da-content-wrap" class="clearfix">
               
                    <!-- Content Area -->
                    <div id="da-content-area">
                        <div class="row-fluid">
                            <div class="span12">                                   
                                <div class="da-panel collapsible">
                                    <div class="da-panel-header">
                                        <span class="da-panel-title">
                                            <i class="icol-grid"></i>Leave Information Form
                                        </span>
                                           
                                    </div>
                                    <div class="da-panel-content da-table-container" style="width:100%; overflow-x:auto;">
<!-- @@@@@@@@@@@@@@@@@@@@ Start of Container Div @@@@@@@@@@@@@@@@@@@@  -->
<div id="containerR" style=" height: auto; margin: 0 auto;">
<div id="msg_div" style="float:left;width:100%;height:auto;" class="messageDiv"><s:property value="meassages"/></div>
<div id="tabPanel_div" style="float:left; width:100%;height:auto;">
<!-- Nav tabs -->
<ul id="tabPanelUL" class="nav nav-tabs">
<% if(userRollS.equals("1")){ %>
  <li class="active"><a href="#application" data-toggle="tab">Application Form</a></li>
  <li ><a id="" href="#applicationList" data-toggle="tab">Application List </a></li>
  <li ><a id="appLeaveLink" href="#approvedLeave" data-toggle="tab">Approved Leave</a></li>
   <li ><a href="#approvedLeaveList" data-toggle="tab">Approved list </a></li>
  <li ><a id="detailsTab" href="#details" data-toggle="tab">Details</a></li>
  <%} else{%>
<li class="active"><a href="#application" data-toggle="tab">Application Form</a></li>
  <li ><a id="" href="#applicationList" data-toggle="tab">Application List </a></li>
  <li ><a href="#approvedLeaveList" data-toggle="tab">Approved list </a></li>
  <li ><a id="detailsTab" href="#details" data-toggle="tab">Details</a></li>
    <%} %>
 </ul>
</div>

<!-- Tab panes -->
<div class="tab-content">
 <div class="tab-pane active" id="application">
<!--################## Start 1st Tab content (Application Form) ##################--> 
<form id="leaveAppForm" name="leaveAppForm" method="post">
<div id="root_div"  style="float:left;width:100%;height:auto;" class="bgBorderk1">
<div id="RowNo1" style="float:left;width:100%;height:20px;" class="fontHeadSubTitlek1">Leave Information</div>
<div id="memberIbfoDiv" style="float: left; width: 100%; height: auto;">


<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">




<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Designation:</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<select name="approverdesignation" id="approverdesignation"
    onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"
    class="banglaTextDob" style="width:100%;" required="required" onchange="getEmployeeLeave(this.id);">
    <option value="">----</option>
    <s:iterator value="designationList" status="status">   
            <option value="<s:property value='designation_id'/>">
            <s:property value="designation_name" />
            </option>   
    </s:iterator>
</select>
    </div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Employee Name  :&nbsp;</label>
    </div>
<div id="EmployeeNameLeaveDiv" style="float: left; width: 60%; height: auto;">
  <jsp:include page="employeeAzaxPage.jsp"></jsp:include>
</div>
</div>

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Leave Type:&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<select name="leaveTypeId" id="leaveTypeId"
    onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"
    class="banglaTextDob" style="width:auto;" required="required">
    <option value="">----</option>
    <s:iterator value="leaveTypeList" status="status">   
            <option value="<s:property value='leave_type_id'/>">
            <s:property value="leave_name" />
            </option>   
    </s:iterator>
</select>
</div>
</div>
</div>
<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">




<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Approved Officer:</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<select name="appApvOff" id="appApvOff"
    onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"
    class="banglaTextDob" style="width:auto;" required="required">
    <option value="">----</option>
    <s:iterator value="approvedEmpList" status="status">   
            <option value="<s:property value='emp_id'/>">
            <s:property value="emp_name" />
            </option>   
    </s:iterator>
</select>
    </div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Date of Apply :&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
   <input id="appApliedDate" type="text" name="appApliedDate" onKeyPress="addSlashes(this);" onBlur="dateFuture(this.id);"
    maxlength="10" size="10" placeholder="DD/MM/YYYY" >
</div>
</div>

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Emergency Contact:&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
  <input id="appempcontact" type="text" name="appempcontact"  onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';" maxlength="14" size="14">
</div>
</div>
</div>


<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Start Date:</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="appStartDate" type="text" name="appStartDate" onKeyPress="addSlashes(this);" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="dateFuture(this.id);" maxlength="10" size="10" placeholder="DD/MM/YYYY" required="required">
    </div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>End Date  :&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
   <input id="appEndDate" type="text" name="appEndDate" onKeyPress="addSlashes(this);" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="countDays();datePast(this.id);this.style.backgroundColor='#d4e3e5';" maxlength="10" size="10" placeholder="DD/MM/YYYY" required="required" />
</div>
</div>

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>No. of Days:&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
    <input id="appNoDay" type="text" name="appNoDay" maxlength="2" size="2" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';" readonly="readonly">
</div>
</div>
</div>
<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Leave Cancellation:</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">

    <input type="radio" value="Y" id="gender1" name="leaveCancel" />
 Yes
    <input type="radio" value="N" id="gender2" name="leaveCancel" checked="checked" />
 No
    </div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Reason for Leave:&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
 <textarea id="leave_reason" name="leave_reason" cols="20" rows="1" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"></textarea>
</div>
</div>

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Address on Leave :&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
  <textarea id="leaveAddress" name="leaveAddress" cols="20" rows="1" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"></textarea>
</div>
</div>
</div>

<div id="Save_div" style="float: left; width: 100%; height: auto;margin-top:5px; margin-bottom:7px;">
<table style="width:100%">
<tr align="center">

<td height="31">
<input type="checkbox" name="printReport" id="printReport" value="Y" class="style2" /> &nbsp;<label style="font-size:16px; font-weight:bold;">Print</label>
</td>
</tr>
<tr align="center">

<td height="31" ><input type="submit" value="Save" class="styled-button-8"/>
</tr>
</table>
</div>


</div>
</div>
</form>
<!--################## End 1st Tab content (Application Form) ##################-->
</div>




 
<div class="tab-pane" id="applicationList">
<!--################## Start 2nd Tab content (Application List) ##################-->
<div id="root_div"  style="float:left;width:100%;height:auto;" class="bgBorderk1">
<div id="RowNo1" style="float:left;width:100%;height:20px;" class="fontHeadSubTitlek1">Application List</div>
<div  style="float:left; width:100%; height:auto;" class="listBgk2">
<table id="leave_application_list_table"   class="table table-hover table-condensed" style="width:100%;">
                 <thead class="listBgk1">
                 <tr class="listFontTitlek1">
                        <th>Emp Name</th>
                        <th>Designation</th>
                        <th>Leave type  </th>
                        <th>Applied Date</th>
                        <th>Start Date</th>
                        <th>End Date</th>
                        <th>Applied To </th>
                        <th>Cancellation</th>
                        <th>&nbsp;</th>
                 </tr>
                </thead>
                 <s:if test='%{leaveApplicationList.size>0}'> 
                <s:iterator value="leaveApplicationList" status="status">
                    <tr style="text-align:center; text-transform:inherit;">
                        <td>
                        <input type="hidden"  id="leave_app_id" name="leave_app_id"  />
                        <s:property value='emp_name'/></td>
                   
                        <td><s:property value='designation_name'/></td>
                       
                        <td><s:property value='leave_type_name'/></td>
                       
                        <td><s:property value='applied_date'/> </td>
                       
                        <td ><s:property value='start_date'/> </td>
                       
                        <td> <s:property value='end_date'/></td>
                        <td ><s:property value='approved_officer'/></td>
                       
                        <td>
                        <s:if test='leave_cancel == "Y"'> YES</s:if>
                        <s:if test='leave_cancel == "N"'> NO</s:if>
                        </td>
                        <td>
                        <a class="edit_app_List_row" href="#" rel="<s:property value='leave_app_id'/>_<s:property value='emp_designation_id'/>_<s:property value='emp_id'/>_<s:property value='leave_type_id'/>_<s:property value='approved_officer_emp_id'/>_<s:property value='applied_date'/>_<s:property value='emergency_contact'/>_<s:property value='start_date'/>_<s:property value='end_date'/>_<s:property value='applied_days'/>_<s:property value='leave_cancel'/>_<s:property value='leave_reason'/>_<s:property value='leave_address'/>">
                        <% if(userRollS.equals("1")){ %>
                        <img src="allPages/modulePages/utilities/Images/forward.png"  height="19"/>
                        <%}%>
                        </a>
                        </td>
               </tr>
               </s:iterator>
               </s:if>
               <s:else>
               <tr style="text-align:center;">
                    <td colspan="9">No data is found</td>
               </tr>
               </s:else>
            </table>
</div>
</div>
<!--################## End 2nd Tab content (Application List) ##################-->
</div>
 
 
 
 
 
 
 
<div class="tab-pane" id="approvedLeave">
<!--################## Start 3rd Tab content (Approve Leave) ##################-->
<form id="approvedForm">
<div id="root_div"  style="float:left;width:100%;height:auto;" class="bgBorderk1">
<div id="RowNo1" style="float:left;width:100%;height:20px;" class="fontHeadSubTitlek1">
Leave Information
<input type="hidden"  id="approved_leave_app_id" name="approved_leave_app_id"  />
</div>
<div id="approvedInfoDiv" style="float: left; width: 100%; height: auto;">

<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Designation:</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">

  <select name="approverDesignationf" id="approverDesignationf"
    onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"
    class="banglaTextDob" style="width:auto;">
    <option value="">----</option>
    <s:iterator value="designationList" status="status">   
            <option value="<s:property value='designation_id'/>">
            <s:property value="designation_name" />
            </option>   
    </s:iterator>
</select>
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Employee Name  :&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
  <select name="appEmpNamef" id="appEmpNamef"
    onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"
    class="banglaTextDob" style="width:auto;">
    <option value="">----</option>
    <s:iterator value="hrEmployeeList" status="status">   
            <option value="<s:property value='emp_id'/>">
            <s:property value="emp_name" />
            </option>   
    </s:iterator>
</select>
</div>
</div>

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Leave Type:&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
 
  <select name="appLeaveTypef" id="appLeaveTypef"
    onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"
    class="banglaTextDob" style="width:auto;">
    <option value="">----</option>
    <s:iterator value="leaveTypeList" status="status">   
            <option value="<s:property value='leave_type_id'/>">
            <s:property value="leave_name" />
            </option>   
    </s:iterator>
</select>
</div>
</div>
</div>
<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Approved Officer:</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
  <select name="appApvOffForward" id="appApvOffForward"
    onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"
    class="banglaTextDob" style="width:auto;">
    <option value="">----</option>
    <s:iterator value="approvedEmpList" status="status">   
            <option value="<s:property value='emp_id'/>">
            <s:property value="emp_name" />
            </option>   
    </s:iterator>
</select>
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label> Date of Apply :&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
  <input id="appApliedDatef" type="text" name="appApliedDatef" onKeyPress="addSlashes(this);" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';" maxlength="10" size="10" placeholder="DD/MM/YYYY">
</div>
</div>

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Emergency Contact:&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
  <input id="appempContactf" type="text" name="appempContactf"  onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';" maxlength="14" size="14">
</div>
</div>
</div>


<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Start Date:</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="appStartDatef" type="text" name="appStartDatef" onKeyPress="addSlashes(this);" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';" maxlength="10" size="10" placeholder="DD/MM/YYYY">
    </div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>End Date  :&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
  <input id="appEndDatef" type="text" name="appEndDatef" onKeyPress="addSlashes(this);" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';" maxlength="10" size="10" placeholder="DD/MM/YYYY">
</div>
</div>

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>No. of Days:&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
  <input id="appNoDayf" type="text" name="appNoDayf" maxlength="2" size="2" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';" readonly="readonly" >
</div>
</div>
</div>
<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Approved Status:</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
    <input type="radio" value="Y" id="appCancell1" name="appCancel" checked="checked" />YES
    <input type="radio" value="N" id="appCancell2" name="appCancel"/>NO
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Reason for Leave:&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
 <textarea id="appReasonf" name="appReasonf"cols="20" rows="1" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"></textarea>
</div>
</div>

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Address on Leave :&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
  <textarea id="appAddressf" name="appAddressf" cols="20" rows="1" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"></textarea>
</div>
</div>
</div>
<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Comments :&nbsp;</label>
    </div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
  <textarea id="appComments" name="appComments" cols="20" rows="1" onFocus="this.style.backgroundColor='#ffff66';"
    onBlur="this.style.backgroundColor='#d4e3e5';"></textarea>
</div>
</div>
</div>

<div id="Save_div" style="float: left; width: 100%; height: auto;margin-top:5px; margin-bottom:7px;">
<table style="width:100%">
<tr align="center">

<td colspan="4"><input type="submit" value="Approved" id="apprBtn" class="styled-button-8" /></td>
</tr>
</table>
</div>
</div>
</div>
</form>
<!--################## End 3rd Tab content (Approve Leave) ##################-->
</div>
 





<div class="tab-pane" id="approvedLeaveList">
<!--################## Start 4th Tab content (Approve List) ##################-->
<div id="root_div"  style="float:left;width:100%;height:auto;" class="bgBorderk1">
<div id="RowNo1" style="float:left;width:100%;height:20px;" class="fontHeadSubTitlek1">Approved Application List</div>
<div  style="float:left; width:100%; height:auto;" class="listBgk2">
<table  id="approved_list_table" class="table table-hover table-condensed" style="width:100%;">
                <thead class="listBgk1">
                <tr class="listFontTitlek1">
                        <th>Emp Name</th>
                        <th>Designation</th>
                        <th>Leave type  </th>
                        <th>Date of Apply</th>
                        <th>Start Date</th>
                        <th>End Date</th>
                        <th>Applied To </th>
                        <th>Approved By</th>
                        <th>Status</th>
                        <th>&nbsp;</th>
                </tr>
                </thead>  
                <s:if test='%{leaveApprovedList.size>0}'> 
                <s:iterator value="leaveApprovedList" status="status">
                    <tr style="text-align:center; text-transform:inherit;">
                        <td>
                        <input type="hidden"  id="leave_approved_id" name="leave_approved_id"  />
                        <s:property value='approved_emp_name'/></td>
                   
                        <td><s:property value='app_designation_name'/></td>
                       
                        <td><s:property value='app_leave_name'/></td>
                       
                        <td><s:property value='applied_date'/> </td>
                       
                        <td ><s:property value='start_date'/> </td>
                       
                        <td> <s:property value='end_date'/></td>
                        <td ><s:property value='Applied_to'/></td>
                        <td ><s:property value='approved_by'/></td>
                        <td>
                        <s:if test='approved_status == "Y"'> YES</s:if>
                        <s:if test='approved_status == "N"'> NO</s:if>
                        </td>
                        <td>
                        <a class="edit_approved_list_row" href="#" rel="<s:property value='approved_emp_name'/>_<s:property value='app_designation_name'/>_<s:property value='app_leave_name'/>_<s:property value='applied_to'/>_<s:property value='officer_designation_name'/>_<s:property value='applied_date'/>_<s:property value='start_date'/>_<s:property value='end_date'/>_<s:property value='appliedDays'/>_<s:property value='leave_reason'/>_<s:property value='leave_address'/>_<s:property value='app_leave_name'/>_<s:property value='approved_by'/>_<s:property value='approved_by_designation'/>_<s:property value='approved_date'/>_<s:property value='app_start_date'/>_<s:property value='app_end_date'/>_<s:property value='comments'/>">
                        <img src="allPages/modulePages/utilities/Images/details.png"  height="19"/>
                        </a>
                        </td>
               </tr>
               </s:iterator>
               </s:if>
               <s:else>
               <tr style="text-align:center;">
                   <td colspan="10">No data is found</td>
               </tr>
               </s:else>
            </table>
</div>
</div>
<!--################## End 4th Tab content (Approve List) ##################-->
</div>






<div class="tab-pane" id="details">
<!--################## Start 5th Tab content (Details) ##################-->
<div id="RowNo1" style="float:left;width:100%;height:20px;" class="fontHeadSubTitlek1">Leave Application Details</div>
<form id="" name="" >
<div id="root_div"  style="float:left;width:100%;height:auto;" class="bgBorderk1">
<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Employee Name:</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="empNameD" type="text" name="empNameD"  readonly="readonly" />
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Designation  :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="empDesignationD" type="text" name="empDesignationD"  readonly="readonly" />
</div>
</div>

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Leave Type:&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="leaveTypeD" type="text" name="leaveTypeD"  readonly="readonly" />
</div>
</div>
</div>

<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 2px;">
<div id="No1" style="float: left; width: 33%; height: auto;">
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
<label>Application To :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<!-- start blood group -->
<div style="width: 100%; float: left; text-align: left;">
<input id="appToNameD" type="text" name="appToNameD"  readonly="readonly" />
</div>
<!--end blood group -->
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
  <label>Designation :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="appDesignationD" type="text" name="appDesignationD"  readonly="readonly" />
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
  <label>Applied Date :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="appliedDateD" type="text" name="appliedDateD"  readonly="readonly" />
</div>
</div>
</div>
<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 2px;">
<div id="No1" style="float: left; width: 33%; height: auto;">
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
<label>Start Date :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<!-- start blood group -->
<div style="width: 100%; float: left; text-align: left;">
<input id="startDateD" type="text" name="startDateD"  readonly="readonly" />
</div>
<!--end blood group -->
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
  <label>To Date :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="endDateD" type="text" name="endDateD"  readonly="readonly" />
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
  <label>No. Of Days :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="noOfDaysD" type="text" name="noOfDaysD"  readonly="readonly" />
</div>
</div>
</div>


<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 2px;">
<div id="No1" style="float: left; width: 33%; height: auto;">
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;">
<label>Leave Cause:&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="leaveCauseD" type="text" name="leaveCauseD"  readonly="readonly" />
<!--end blood group -->
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
  <label>Address While Leave:&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="addressD" type="text" name="addressD"  readonly="readonly" />
</div>
</div>
</div>

<div id="RowNo1" style="float:left;width:100%;height:20px;" class="fontHeadSubTitlek1">Approved Details</div>
<div id="approveDetailsInfo_Div" style="float: left; width: 100%; height: auto;">
<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 5px; margin-top: 2px;">




<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Leave Type:</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="offLeaveType" type="text" name="offLeaveType"  readonly="readonly" />
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Approved By  :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="approvedByD" type="text" name="approvedByD"  readonly="readonly" />
</div>
</div>

<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
   <label>Designation:&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="appByDesigD" type="text" name="appByDesigD"  readonly="readonly" />
</div>
</div>
</div>

<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 2px;">
<div id="No1" style="float: left; width: 33%; height: auto;">
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
<label>Approved Date :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<!-- start blood group -->
<div style="width: 100%; float: left; text-align: left;">
<input id="appDateD" type="text" name="appDateD"  readonly="readonly" />
</div>
<!--end blood group -->
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
  <label>Start Date :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="offStartDate" type="text" name="offStartDate"  readonly="readonly" />
</div>
</div>
<div id="No2" style="float: left; width: 33%; height: auto;" >
<div id="1_cell" style="float: left; width: 40%; height: auto; text-align: right;" class="banglaTextLabel">
  <label>To Date :&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 60%; height: auto;">
<input id="offEndDate" type="text" name="offEndDate"  readonly="readonly" />
</div>
</div>
</div>

<div id="RowNo1" style="float: left; width: 100%; height: auto; margin-bottom: 2px;">
<div id="No1" style="float: left; width: 100%; height: auto;">
<div id="1_cell" style="float: left; width: 13%; height: auto; text-align: right;">
<label>Comment:&nbsp;</label>
</div>
<div id="2_cell" style="float: left; width: 53%; height: auto;">
<input id="offComment" type="text" name="offComment"  readonly="readonly" />
<!--end blood group -->
</div>
</div>
</div>

</div>


</div>
</form>
<!--################## End 5th Tab content (Details) ##################-->
</div>



</div>
</div>
<!-- @@@@@@@@@@@@@@@@@@@@ End of Container Div @@@@@@@@@@@@@@@@@@@@  -->
                            </div>
                                </div>
                            </div>
                        </div>
                        </div>
                        </div>