<style>
.cstm_view{font-size:15px;}
</style>
<!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
          <h3>
            Category Settings
            
          </h3>
          <!--<ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
            <li class="active">Dashboard</li>
          </ol>-->
    </section>

    <!-- Main content -->
    <section class="content">
      <div class="row">
        <div class="col-xs-12">
          <div class="box box-primary">
            <div class="box-header with-border">
				<div class="admin_tab">
				 <ul>
					<li><a href="<?php echo base_url('admin/category/content');?>">Add</a></li>              
				</ul>
				<!-- <a href="<?php echo base_url('admin/category/content');?>" class="btn btn-sm btn-primary" style="float:right">Add Category</a>	-->					
							<?php if($this->session->flashdata('error_msg')){?>
								<span style="color:red; font-weight:bold"><?php echo $this->session->flashdata('error_msg');?></span>
							<?php }?>
							<?php if($this->session->flashdata('success_msg')){?>
								<span style="color:green; font-weight:bold"><?php  echo $this->session->flashdata('success_msg'); ?></span>
							<?php }?>
				</div>		  
            </div>
            <!-- /.box-header -->
            <div class="box-body">
              <table id="example1" class="table table-bordered table-striped">
                <thead>
                <tr>                                   
				  <th>Name</th>	
				  <th>Parent</th>                 
				  <th class="no-sort">Action</th>
                </tr>
                </thead>
                <tbody>
                </tbody>
                <tfoot>
                </tfoot>
              </table>
            </div>
            <!-- /.box-body -->
          </div>
          <!-- /.box -->
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </section>
    <!-- /.content -->
  </div>
  <!-- Modal -->
	  <div class="modal" id='myModal'>
          <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">×</span></button>
                <h4 class="modal-title">Message</h4>
              </div>
              <div class="modal-body" id='modalContent' title="">
               <!-- <p>Would you like to continue ?</p>-->
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-primary" data-dismiss="modal" id="cdel">Ok</button>
              </div>
            </div>
            <!-- /.modal-content -->
          </div>
          <!-- /.modal-dialog -->
        </div>
		
		<div class="modal" id='myModalinactive'>
          <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">×</span></button>
                <h4 class="modal-title">Message</h4>
              </div>
              <div class="modal-body" id='modalContentinactive' title="">
               <!-- <p>Would you like to continue ?</p>-->
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-primary" data-dismiss="modal" id="inactive">Ok</button>
              </div>
            </div>
            <!-- /.modal-content -->
          </div>
          <!-- /.modal-dialog -->
        </div>
		
	  <!-- Modal -->
    <!-- Modal -->
	<div class="modal" id='myModalmdelete'>
          <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">×</span></button>
                <h4 class="modal-title">Message</h4>
              </div>
              <div class="modal-body" id='modalContentmdelete' title="">
               <!-- <p>Would you like to continue ?</p>-->
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-primary" data-dismiss="modal" id="mdel">Ok</button>
              </div>
            </div>
            <!-- /.modal-content -->
          </div>
          <!-- /.modal-dialog -->
        </div>
    <div class="modal" id='myModal2'>
          <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">×</span></button>
                <h4 class="modal-title">Category Details</h4>
              </div>
              <div class="modal-body" id='modalContent2' title="" style="height:50%">
               <!-- <p>Would you like to continue ?</p>-->
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-primary" data-dismiss="modal" id="cdel2">Ok</button>
              </div>
            </div>
            <!-- /.modal-content -->
          </div>
          <!-- /.modal-dialog -->
        </div>
    <!-- Modal -->
<script src="<?php echo base_url()?>public/admin_assets/plugins/datatables/jquery.dataTables.min.js"></script>
<script src="<?php echo base_url()?>public/admin_assets/plugins/datatables/dataTables.bootstrap.min.js"></script>

<script>
$(document).ready(function() { 
	table = $('#example1').DataTable({ 
 
        "processing": true, //Feature control the processing indicator.
        "serverSide": true, //Feature control DataTables' server-side processing mode.
        "order": [], //Initial no order.
 
        // Load data for the table's content from an Ajax source
        "ajax": {
            "url": "<?php echo site_url('admin/category/all_content_list')?>",
            "type": "POST"
        },
 
        //Set column definition initialisation properties.
        "columnDefs": [
        { 
            "targets": 'no-sort', //1st and last column
            "orderable": false, //set not orderable
        },
        ],
    });
	
	var dtable = $("#example1").dataTable().api();
	
	$(".dataTables_filter input")
    .unbind() // Unbind previous default bindings
    .bind("input", function(e) { // Bind our desired behavior
        // If the length is 3 or more characters, or the user pressed ENTER, search
        if(this.value.length >= 3 || e.keyCode == 13) {
            // Call the API search function
            dtable.search(this.value).draw();
        }
        // Ensure we clear the search if they backspace far enough
        if(this.value == "") {
            dtable.search("").draw();
        }
        return;
    });
	
$(document).on( "click",'#view.cstm_view',function() {
    var id=$(this).prop('title');
    var content='<div class="box-body"><table class="table table-bordered">';
    $.ajax({
      type:'POST',
      url :'<?php echo base_url('admin/category/all_details');?>',
      data:'category_id='+id,
      dataType:'json',
      success:function(result){			
		   content+='<tr><td>Name</td> <td>'+result.category_name+'</td></tr>';	
		   content+='<tr><td>Parent Category Name</td> <td>'+result.parent.category_name+'</td></tr>';
		   content+='<tr><td>Date Of Creation</td> <td>'+result.date_of_creation+'</td></tr>';
		   //content+='<tr><td>Time</td> <td>'+result.time+'</td></tr>';
		   //content+='<tr><td>Profile Image</td> <td><img src="<?php echo base_url();?>'+img_src+'"style="width:80px;" id="blah"></td></tr>';
		   content+='</table></div>';			
      $('#modalContent2').html(content);  
      $('#myModal2').modal('show');
      },error:function(){

      }
    });
  });
  
  $(document).on( "click",'#delete.cstm_view',function() {
		$('#modalContent').html('<p>Would you like to continue ?</p>');
		var id=$(this).prop('title');
		$('#modalContent').attr('title',id);
		$('#myModal').modal('show');
	});
	$(document).on('click','#cdel',function(){
	var id=$('#modalContent').prop('title');
		$.ajax({
		  type: "POST",
		  url: '<?php echo base_url('admin/category/del')?>',
		  data: 'category_id='+id,
		  dataType:'json',
		  success: function(response){
			$('#modalContent').html(response.message);  
			$('#myModal').modal('show');
			setTimeout(function(){
				$('#myModal').modal('hide')
			},400);
			window.location.reload('<?php echo base_url('admin/cms'); ?>');
			
		  },
		  error:function(response){
			$('#modalContent').html(response.message);  
			$('#myModal').modal('show');
			setTimeout(function(){
				$('#myModal').modal('hide')
			},400);
		  }
		});
	});
});
</script>