<?php
$collapse_add_area = "collapse";
$where 	= " WHERE 1=1 ";

$query_string = "";

$button_value 	= "Add";
$table_name		= "ess_items";
$page_action 	= "add";
$page_name		= "ESS Items";	
###########################################  PAGING WITH PER PAGE  #####################################
$query = "SELECT * FROM notes ORDER BY created_on DESC ";
$sql=mysqli_query($conn,$query);
$total_no_of_timesheets=mysqli_num_rows($sql);
?>
<section class="content-header">
  <h1>
	<? echo $page_name; ?>
  </h1>		
</section>

<section class="content">
	<div class="row">
		<div class="col-xs-12">
			<div class="box">
				<div class="box-body">
					<div class="row" style="padding:0px 10px;">
						<?php include_once('add_ess_items.inc.php');?>
					</div>
					<div class="table-responsive">
						<input type="text" name="search" id="search" class="pull-right">
						<table id="post_out_table" class="table table-bordered table-striped">
							<thead>
								<tr>
									<th width="30%">Heading</th>
									<th width="30%">Item</th>
									<th>Edit</th>
									<th>Delete</th>
								</tr>
							</thead>
						</table>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
	
<script type="text/javascript">
$(document).ready(function(){
	$('#add_post_out').click(function(){
		$('#post_out_area').slideToggle();
		$("#ess_items").val("");
		$("#page_action").val("add");
		$("#submit_form").html("Add");
	});
	
	$('#post_out_table').DataTable({
        "processing": true,
        "serverSide": true,
		"paging": false,
		"lengthChange": false,
		"searching": false,
		"ordering": false,
		"info": false,
		"autoWidth": false,
        "ajax": "<?php echo $siteURL?>/ess/index?page=ajax_ess_items",
        "columns": [
            { "data": "heading" },
            { "data": "items" },
			{
				sortable: false,
                 "render": function ( data, type, full, meta ){
                     var buttonID = full.id;
                     return '<span style="cursor:pointer;" class="post_out_edit" alt="'+buttonID+'"><i class="fa fa-edit" style="font-size:20px;"></i></span><i class="fa fa-refresh fa-spin" style="display:none;" id="edit_items'+buttonID+'"></i>';
                 }
            },
			{
				sortable: false,
                 "render": function ( data, type, full, meta ){
                     var buttonID = full.id;
                     return '<span style="cursor:pointer;" class="post_out_remove" alt="'+buttonID+'"><i class="fa fa-trash-o" style="font-size:20px;"></i></span>';
                 }
            }
        ],
		"drawCallback": function( settings ) {
			//alert( 'DataTables has redrawn the table' );
			//// Filtering 
			if($('#search').val() !=""){
				var value = $('#search').val().toLowerCase();
				//alert($("#telephone_message_table tr").text().toLowerCase().indexOf(value));
				//$("#telephone_message_table tr").filter(function() {
					setTimeout(function(){
						$("#post_out_table tbody tr").filter(function(){
							$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1);
						});
					},1000);
				//});
			}
		}
    });
	
	var post_out_t = $('#post_out_table').DataTable();
	$('#post_out_table tbody').on('click', '.post_out_edit',function(){
		$("html,body").animate({
			scrollTop: $("#post_out_area").offset().top - 110},
		'slow');
		
		var post_out_id = $(this).attr("alt");
		$("#edit_items"+post_out_id).show();
		var form_data   = {'post_out_id':post_out_id};
		$.ajax({
			async: true,
			type: "POST",
			url: "<?php echo $siteURL?>/ess/index?page=ajax_ess_items&action=edit_ess_items",
			data: form_data,
			success: function(result){
				var resultObj = jQuery.parseJSON(result); 
				console.log(resultObj);
				if(resultObj.status == "1"){
					var heading=resultObj.ess_heading;
					$('#post_out_area').slideDown();
					$("#ess_heading").select2("val", heading);
					$("#ess_items").val(resultObj.ess_items);
					$("#edit_items"+post_out_id).hide();
					$("#id").val(post_out_id);
					$("#page_action").val("update");
					$("#submit_form").html("Update");
				}
			}
		});	
	});
	
	$('#post_out_table tbody').on('click', '.post_out_remove',function(){
		var post_out_edit_id = $("#id").val();
		var post_out_id = $(this).attr("alt");
		if(post_out_edit_id == post_out_id){
			alert("This Record open in edit mode so you can not delete it.");
			return false;
		}
		if(confirm("Do you want to delete.")){
			var form_data   = {'post_out_id':post_out_id};
			$.ajax({
				async: true,
				type: "POST",
				url: "<?php echo $siteURL?>/ess/index?page=ajax_ess_items&action=delete_ess_items",
				data: form_data,
				success: function(result){
					var resultObj = jQuery.parseJSON(result); 
					if(resultObj.status == "success"){
						post_out_t.draw( false );
					}
				}
			});	
		}
	});
	
	$(document).on('submit','form#add_form',function(e){
		$(this).find('#post_out_notes_done').hide();
		$(this).find('#page_load_div_for_post_out').show();
		$(this).find("#add_master_data").attr("disabled", true);
		
		e.preventDefault(); //prevent Default functionality
		var page_action = $("#page_action").val();
		var flag = 0;
		if(page_action == "add"){
			flag = 1;
		}
		
		var form_data = $('form').serialize();     
		$.ajax({
			async: true,
			type: "POST",
			url: "<?php echo $siteURL?>/ess/index?page=ajax_ess_items&action=add_ess_items",
			data: form_data,
			success: function(result){ 
				if(flag == 0){
					$("#page_action").val("add");
					$("#submit_form").html("Add");
					//$('#post_out_area').slideToggle();
				}
				$("#id").val("");
				//var frm = document.getElementsByName('add_form')[0];
				//frm.reset();  // Reset all form data	
					
				$('#post_out_notes_done').show();
				$('#page_load_div_for_post_out').hide();
				$("#add_master_data").attr("disabled", false);
				$("#ess_items").val("");
				var resultObj = jQuery.parseJSON(result); 
				if(resultObj.status == "success"){
					post_out_t.draw( false );
				}
				setTimeout(function() {
					$('#post_out_notes_done').hide();
				},1000);
				setTimeout(function() {
					$('#add_post_out').trigger("click");
				},1000);
			}
		});
	});
	
	$("#search").on("keyup", function() {
		var value = $(this).val().toLowerCase();
		$("#post_out_table tbody tr").filter(function() {
		  $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
		});
	});
});	
</script>