<h2>Company Setting</h2>
<hr/>
<?php 
    include('../config/config.php');
    $sql = "SELECT * FROM companys ";
    $res = $conn->query($sql);
    $n = 0;
    while($row = $res->fetch_assoc()){
?>
<p class="text-right">
  <button class="btn btn-success" id="edit_open"><i class="fa fa-pencil" aria-hidden="true"></i> Edit</button>
  <button class="btn btn-danger" id="edit_colse"><i class="fa fa-pencil" aria-hidden="true"></i> Cancel</button>
</p>
<form id="add_company" method="post" enctype="multipart/form-data">
  <div id="error_add_project"></div>
  <div class="row">
    <div class="col-md-12">
      <div class="form-group">
        <label>Company Title</label>
        <input type="text" class="form-control" id="com_title" name="com_title" placeholder="Company Title" value="<?php echo $row['ab_title']; ?>">
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12">
      <div class="form-group">
        <label>Company Description</label>
        <textarea rows="15" type="text" class="form-control" id="com_desc" name="com_desc" ><?php echo $row['ab_desc']; ?></textarea> 
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-md-6">
      <div class="form-group">
        <label>Company Images</label>
        <input type="file" class="form-control" id="com_image" name="com_image"> 
      </div>
    </div>
    <div class="col-md-6">
      <div class="form-group">
      <?php  echo '<img class="img-responsive" src="'."../".$row['ab_image'].'"/>'; ?>
      </div>
    </div>
  </div>
  <button class="btn btn-primary" type="submit">Update</button>
  <button class="btn btn-danger" type="reset">Cancel</button>
</form>
<?php 
  }
  ?>
<hr/>
<script>
$('#add_company').validate({
      rules: {
        com_title: {
                required: true,
            },
        com_desc: {
            required: true,
        },          
      },
      messages: {
          com_title: {
              required: "<p style='color:red'>Please Insert Compamy Title</p>",
          },
          com_desc: {
              required: "<p style='color:red'>Please Insert Compamy Descirption</p>",
          },          
      },
      submitHandler: function(form) {
        var file_data = $('#com_image').prop('files')[0];   
        var com_title = $('#com_title').val();
        var com_desc = $('#com_desc').val();
       
        var form_data = new FormData();          
        form_data.append('file', file_data);
        form_data.append('com_title', com_title);
        form_data.append('com_desc', com_desc);
              
        $.ajax({
            url: "update_company.php",
            dataType: 'text', 
            cache: false,
            contentType: false,
            processData: false,
            data: form_data,                         
            type: 'post',
        }).done(function(data){
          console.log(data);
          if(data == 1){
              $("#error_add_project").html("<div class='alert alert-success'>Edit Company Success</div>").fadeIn(1000).delay(1000).fadeOut(function(){    location.reload(); });
              $('#add_company')[0].reset();
              $("#add_company :input").prop("disabled", true);
          }else{
            $("#error_add_project").html("<div class='alert alert-danger'>Not Edit Company</div>").faceIn(1000).delay(1000).faeOut(1000);
              return false;
          }
        });
      }
    });

</script>
<script>
  $(document).ready(function(){
    $("#add_company :input").prop("disabled", true);
    $("#edit_colse").hide();
  });

  $("#edit_open").click(function(){
    $("#add_company :input").prop("disabled", false);
    $("#edit_colse").show();
    $("#edit_open").hide();
  });

  $("#edit_colse").click(function(){
    $("#add_company :input").prop("disabled", true);
    $("#edit_colse").hide();
    $("#edit_open").show();
  });
</script>