<?php include("sass/icon_for_datepicker_and_datatable.php");?>
		 <script>
	$(function(){
		//insert record
		$('#insert').click(function(){
			var emp_fname = $('#emp_fname').val();
			var emp_mname = $('#emp_mname').val();
			var emp_lname = $('#emp_lname').val();
			var emp_email = $('#emp_email').val();
			var emp_contact = $('#emp_contact').val();
			var emp_designation = $('#emp_designation').val();
			var emp_gender = $('#emp_gender').val();
			var emp_country = $('#emp_country').val();
			var emp_comments = $('#emp_comments').val();

			
			$.post('ajax_action.php',{action: "insert", emp_fname:emp_fname, emp_mname:emp_mname, emp_lname:emp_lname, emp_email:emp_email, emp_contact:emp_contact, emp_designation:emp_designation, emp_gender:emp_gender, emp_country:emp_country, emp_comments:emp_comments},function(res){
				$('#result').html(res);
			});	
			var emp_fname = document.getElementById('emp_fname') ;
			emp_fname.value ='';
			var emp_mname = document.getElementById('emp_mname') ;
			emp_mname.value ='';
			var emp_lname = document.getElementById('emp_lname') ;
			emp_lname.value ='';
			var emp_email = document.getElementById('emp_email') ;
			emp_email.value ='';
			var emp_contact = document.getElementById('emp_contact') ;
			emp_contact.value ='';
			var emp_designation = document.getElementById('emp_designation') ;
			emp_designation.value ='';
			var emp_gender = document.getElementById('emp_gender') ;
			emp_gender.value ='';
			var emp_country = document.getElementById('emp_country') ;
			emp_country.value ='';
			var emp_comments = document.getElementById('emp_comments') ;
			emp_comments.value ='';
		});
	
		//show records
		$('#update').click(function(){
			
			var employee_id = $('#xpaytype').val();
			var emp_fname = $('#emp_fname_Last').val();
			var emp_mname = $('#emp_mname_Last').val();
			var emp_lname = $('#emp_lname_Last').val();
			var emp_email = $('#emp_email_Last').val();
			var emp_contact = $('#emp_contact_Last').val();
			var emp_designation = $('#emp_designation_Last').val();
			var emp_gender = $('#emp_gender_Last').val();
			var emp_country = $('#emp_country_Last').val();
			var emp_comments = $('#emp_comments_Last').val();

			
			$.post('ajax_action.php',{action: "update", employee_id:employee_id, emp_fname:emp_fname, emp_mname:emp_mname, emp_lname:emp_lname, emp_email:emp_email, emp_contact:emp_contact, emp_designation:emp_designation, emp_gender:emp_gender, emp_country:emp_country, emp_comments:emp_comments},function(res){
				$('#result').html(res);
			});	
			
		});
	});
</script>
        <div class="wrapper row-offcanvas row-offcanvas-left">
            <!-- Left side column. contains the logo and sidebar -->
            <?php include("sass/sidebar.php");?>

            <!-- Right side column. Contains the navbar and content of the page -->
               <aside class="right-side">
                <!-- Content Header (Page header) -->
                <section class="content-header">
                    <h1>
                       <?php echo $company_name ; ?>
                        <small>Control panel</small>
                    </h1>
                    <ol class="breadcrumb">
                        <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
                        <li class="active">Dashboard</li>
                    </ol>
                </section>
                 <section class="content">
                 
					
                 <?php
							if (!empty($errMsg))
							{echo "<div class='alert alert-warning alert-dismissible' role='alert'>$errMsg";
							echo "<button type='button' class='close' data-dismiss='alert'><span aria-hidden='false'>&times;</span><span class='sr-only'>		Close</span></button>
                        </div>";}
                        ?>
                 			<div class="box box-primary">
                                <div class="box-header">
                                    <h3 class="box-title">Employee List Entry</h3>
                                </div><!-- /.box-header -->
                                <!-- form start -->
                                
                            
                                <!--<form role="form"  action="<?php //echo $_SERVER['SCRIPT_NAME']; ?>" method="post" id="login_form">-->
                                    <div class="box-body">
                                    	<div class="col-md-12">
                                        <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="exampleInputEmail1">First Name</label>
                                            <input type="text" class="form-control" name="emp_fname" id="emp_fname">
                                        </div>
                                        <div class="form-group">
                                            <label for="exampleInputEmail1">Middle Name</label>
                                            <input type="text" class="form-control" name="emp_mname" id="emp_mname">
                                        </div>
                                        <div class="form-group">
                                            <label for="exampleInputEmail1">Last name</label>
                                            <input type="text" class="form-control" name="emp_lname" id="emp_lname">
                                        </div>
                                        
                                        <div class="form-group">
                                            <label for="exampleInputEmail1">Email</label>
                                            <input type="text" class="form-control" name="emp_email" id="emp_email">
                                        </div>
                                        <div class="form-group">
                                            <label for="exampleInputEmail1">Contact No</label>
                                            <input type="text" class="form-control" name="emp_contact" id="emp_contact">
                                        </div>
                                        </div>
                                        
                                        
                                        
                                        <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="exampleInputEmail1">Designation</label>
                                            <input type="text" class="form-control" name="employee_txt8" id="emp_designation">
                                        </div>
                                        <div class="form-group">
                                            <label for="exampleInputEmail1">Gender</label>
                                            <select class="form-control" name="head_design" id="emp_gender">
                                            	<option value="Male"> Male </option>
                                                <option value="Female"> Female </option>
                                                </select>  
                                                </div>
                                        <div class="form-group">
                                            <label for="exampleInputEmail1">Country</label>
                                            <select class="form-control" name="head_design" id="emp_country">
                                            	<option value="BD"> Bangladesh </option>
                                                <option value="USA"> USA </option>
                                                </select>  
                                                </div>
                                        <div class="form-group">
                                            <label for="exampleInputEmail1">Comments</label>
                                            <input type="text" class="form-control" name="emp_lname0" id="emp_comments">
                                        </div>
                                                
                                                
                                        </div>
									</div>
												<!-- /.box-body -->

                                    <div class="box-footer">
                                        <button name="submit"  id="insert" class="btn btn-primary">Submit</button>
                                    </div>
                               <!--  </form>-->
                            </div>
                 
                 		</div>
				 
                 </section>
				 
				 
				  <section class="content">
					<div class="box-body table-responsive" id="result">
							                        <?php echo "<table id='example1' class='table table-bordered table-striped'>
                                        <thead>
                                            <tr>
                                               <th>First Name</th>
                                                <th>Middle Name</th> 
                                                <th>Last name</th>                    
                                                <th>Email</th>                    
                                                <th>Contact No</th>                    
                                                <th>Designation</th>                    
                                                <th>Gender</th>                    
                                                <th>Country</th>                    
                                                <th>Comments</th>                                  
                                                <th>Action</th>
                                            </tr>

                                        </thead>
                                        <tbody>"; ?>
										<?php
                                        
                                        $query = "SELECT * FROM employee";
                                        $result = mysqli_query($connection,$query);
                                        
										 $i=0;
                                        while($row=mysqli_fetch_array($result))
                                        {
                                        
                                         $i++;
                                        
										 $employee_id = $row['employee_id'];
											$emp_fname = $row['emp_fname'];
											$emp_mname = $row['emp_mname'];
											$emp_lname = $row['emp_lname'];
											$emp_email = $row['emp_email'];
											$emp_contact = $row['emp_contact'];
											$emp_designation = $row['emp_designation'];
											$emp_gender = $row['emp_gender'];
											$emp_country = $row['emp_country'];
											$emp_comments = $row['emp_comments'];
											
										
                                        
                                        
                                        echo "<tr>
                                        <td>$emp_fname
										<input type='hidden' id='emp_fname$i' value='$emp_fname'/>
										</td>
                                        <td>$emp_mname
										<input type='hidden' id='emp_mname$i' value='$emp_mname'/>
										</td>
                                        <td>$emp_lname
										<input type='hidden' id='emp_lname$i' value='$emp_lname'/>
										</td>
                                        <td>$emp_email
										<input type='hidden' id='emp_email$i' value='$emp_email'/>
										</td>
                                        <td>$emp_contact
										<input type='hidden' id='emp_contact$i' value='$emp_contact'/>
										</td>
                                        <td>$emp_designation
										<input type='hidden' id='emp_designation$i' value='$emp_designation'/>
										</td>
                                        <td>$emp_gender
										<input type='hidden' id='emp_gender$i' value='$emp_gender'/>
										</td>
                                        <td>$emp_country
										<input type='hidden' id='emp_country$i' value='$emp_country'/>
										</td>
                                        <td>$emp_comments
										<input type='hidden' id='emp_comments$i' value='$emp_comments'/>
										</td>
                                        <td>
                                       <input type='hidden' id='zipsearch$i' value='$employee_id'/> <button type='button' class='btn btn-primary' data-toggle='modal' data-target='#myModal' onClick='sync$i()'><i class='fa fa-edit'></i> &nbsp;Edit</button>
									   
									   <button type='button' class='btn btn-danger' data-toggle='modal' data-target='#delmodel$i'><i class='fa fa-times'></i> &nbsp;Delete</button>
                                        </td> 
                                        </tr>";
										
										
										echo "<script>
function sync$i()
{
  var collect = document.getElementById('zipsearch$i');
  var entry = document.getElementById('xpaytype');
  
  
  var emp_fnamecollect = document.getElementById('emp_fname$i');
  var emp_fnameentry = document.getElementById('emp_fname_Last');
  
  
  var emp_mnamecollect = document.getElementById('emp_mname$i');
  var emp_mnameentry = document.getElementById('emp_mname_Last');
  
  
  var emp_lnamecollect = document.getElementById('emp_lname$i');
  var emp_lnameentry = document.getElementById('emp_lname_Last');
  
  
  var emp_emailcollect = document.getElementById('emp_email$i');
  var emp_emailentry = document.getElementById('emp_email_Last');
  
  
  var emp_contactcollect = document.getElementById('emp_contact$i');
  var emp_contactentry = document.getElementById('emp_contact_Last');
  
  
  var emp_designationcollect = document.getElementById('emp_designation$i');
  var emp_designationentry = document.getElementById('emp_designation_Last');
  
  
  var emp_gendercollect = document.getElementById('emp_gender$i');
  var emp_genderentry = document.getElementById('emp_gender_Last');
  
  
  var emp_countrycollect = document.getElementById('emp_country$i');
  var emp_countryentry = document.getElementById('emp_country_Last');
  
  
  var emp_commentscollect = document.getElementById('emp_comments$i');
  var emp_commentsentry = document.getElementById('emp_comments_Last');
  
  
  
  
  entry.value = collect.value;
  emp_fnameentry.value = emp_fnamecollect.value;
  emp_mnameentry.value = emp_mnamecollect.value;
  emp_lnameentry.value = emp_lnamecollect.value;
  emp_emailentry.value = emp_emailcollect.value;
  emp_contactentry.value = emp_contactcollect.value;
  emp_designationentry.value = emp_designationcollect.value;
  emp_genderentry.value = emp_gendercollect.value;
  
  
  emp_countryentry.value = emp_countrycollect.value;
  
  emp_commentsentry.value = emp_commentscollect.value;
  
   
}
</script> ";

echo "<div class='modal fade' id='delmodel$i' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>
  <div class='modal-dialog'>
    <div class='modal-content'>
      <div class='modal-header'>
        <button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
        <h4 class='modal-title' id='myModalLabel'>Delete Package</h4>
      </div>
      <div class='modal-body'>
    Are You sure you want to delete  $emp_fname ?
      </div>
      <div class='modal-footer'>
        <button type='button' class='btn btn-default' data-dismiss='modal'>No</button>
        <a href='delete.php?tbl=employee&idcol=employee_id&id=$employee_id&redirect=ajax_main'><button type='button' class='btn btn-danger'>Yes</button></a>
      </div>
    </div>
  </div>
</div>";

										
										}	
                                        ?>

                                        </tbody>
                                        <tfoot>
                                            <tr>
                                                <th>First Name</th>
                                                <th>Middle Name</th> 
                                                <th>Last name</th>                    
                                                <th>Email</th>                    
                                                <th>Contact No</th>                    
                                                <th>Designation</th>                    
                                                <th>Gender</th>                    
                                                <th>Country</th>                    
                                                <th>Comments</th>                                  
                                                <th>Action</th>
                                            </tr>

                                        </tfoot>
                                    </table>
                                    
                                 <?php
echo "<script src='js/plugins/datatables/jquery.dataTables.js' type='text/javascript'></script>
        <script src='js/plugins/datatables/dataTables.bootstrap.js' type='text/javascript'></script>
        
        <script type='text/javascript'>
            $(function() {
                $('#example1').dataTable();
                $('#example2').dataTable({
                    'bPaginate': true,
                    'bLengthChange': false,
                    'bFilter': false,
                    'bSort': true,
                    'bInfo': true,
                    'bAutoWidth': false
                });
            });
        </script>";

								 ?>

				 </div>
				 
				                                   
										<div class='modal fade' id='myModal' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>
  <div class='modal-dialog'>
    <div class='modal-content'>
      <div class='modal-header'>
        <button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
        <h4 class='modal-title' id='myModalLabel'>Update Employee</h4>
      </div>
      <div class='modal-body'>
      <input type="hidden" id='xpaytype' name='employee_id' class='form-control'/>
        
                    <div class="form-group">
                        <input type="text" id='emp_fname_Last' name="emp_fname" class="form-control" placeholder="Movie Name"/>
                    </div>
                    <div class="form-group">
                        <input type="text" id='emp_mname_Last' name="emp_mname" class="form-control" placeholder="emp_mname"/>
                    </div>
                    <div class="form-group">
                        <input type="text" id='emp_lname_Last' name="emp_lname" class="form-control" placeholder="emp_lname"/>
                    </div>
                    <div class="form-group">
                 	
                     <input type="text" id='emp_email_Last' name="emp_email" class="form-control" placeholder="emp_lname"/>
                        
                    </div>
                    <div class="form-group">
                    <input type="text" id='emp_contact_Last' name="emp_contact" class="form-control" placeholder="Release Year"/>
                    </div>
					<div class="form-group">
                        <select class="form-control" name="emp_gender" id='emp_gender_Last' >
                           <option value="Male"> Male </option>
                           <option value="Female"> Female </option>
                        </select>
                    </div>
					<div class="form-group">
                        <select class="form-control" name="emp_designation" id='emp_designation_Last' >
                           <option value="BD"> Bangladesh </option>
                           <option value="USA"> USA </option>
                        </select>
                    </div>
                    
                    <div class="form-group">
                        <input type="text" id='emp_country_Last' name="emp_country" class="form-control" placeholder="Movie Full Name (With Extention)"/>
                    </div>
                    
                    <div class="form-group">
                        <input type="text" id='emp_comments_Last' name="emp_comments" class="form-control" />
                    </div>
                    
                    
                   
                    
                    
      </div>
      <div class='modal-footer'>
        <button type='button' class='btn btn-default' data-dismiss='modal'>Close</button>
        <button type='button' data-dismiss='modal' id="update" class='btn btn-primary'>Save</button>
      </div>
    </div>
  </div>
</div>

				    </section>
                </aside>
                <!-- /.right-side -->
        </div><!-- ./wrapper -->

        <!-- add new calendar event modal -->


        <!-- jQuery 2.0.2 -->
          <?php include("sass/footer_for_ajax.php");?>

    </body>
</html>