name : director_setting.php
<?php session_start(); 
if(isset($_SESSION['status']) != 1  || isset($_SESSION['stauts_login']) != 1 ){
  header("Location:index.php");
}
?>
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>AdminLTE 2 | Dashboard</title>
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
  <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
  <link rel="stylesheet" href="bower_components/Ionicons/css/ionicons.min.css">
  <link rel="stylesheet" href="dist/css/AdminLTE.css">
  <link rel="stylesheet" href="dist/css/skins/_all-skins.min.css">
  <link rel="stylesheet" href="bower_components/morris.js/morris.css">
  <link rel="stylesheet" href="bower_components/jvectormap/jquery-jvectormap.css">
  <link rel="stylesheet" href="bower_components/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css">
  <link rel="stylesheet" href="bower_components/bootstrap-daterangepicker/daterangepicker.css">
  <link rel="stylesheet" href="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">
<?php include('layout/header.php'); ?>
<?php include('layout/sidebar.php'); ?>
  <div class="content-wrapper">
  <div class="row" style="margin-left:20px;">
      <div class="col-md-6">
      <h2>Director List</h2>
      <hr/>

        <div id="table_director"></div>
      </div>
      <div class="col-md-6">
      <h2>Add Director</h2>
      <hr/>
      <div class="panel panel-primary">
        <div class="panel-heading">Add Director</div>
        <div class="panel-body">
          
         <form id="add_direc" method="post" enctype="multipart/form-data">
          <div id="error_add_direc"></div>
          <div class="row">
            <div class="col-md-7">
              <div class="form-group">
                <label>Director Name</label>
                <input type="text" class="form-control" id="direc_name" name="direc_name" placeholder="Director Name">
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-7">
              <div class="form-group">
                <label>Director Position</label>
                <input type="text" class="form-control" id="direc_posi" name="direc_posi" placeholder="Director Position">
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-7">
              <div class="form-group">
                <label>Director Images</label><span class="text-danger">|  **image size : 736px * 815px</span>
                <input type="file" class="form-control" id="direc_image" name="direc_image"> 
              </div>
            </div>
          </div>
          <button class="btn btn-primary" type="submit">Save</button>
        <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
      </div>
       
      </form>
        </div>
      </div>

      </div>
    </div>
  </section>
</div>
  </div>

</div>
<!-- ./wrapper -->
</body>

 

<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/jquery-ui/jquery-ui.min.js"></script>
<script>
  $.widget.bridge('uibutton', $.ui.button);
</script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/raphael/raphael.min.js"></script>
<script src="bower_components/morris.js/morris.min.js"></script>
<script src="bower_components/jquery-sparkline/dist/jquery.sparkline.min.js"></script>
<script src="plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<script src="bower_components/jquery-knob/dist/jquery.knob.min.js"></script>
<script src="bower_components/moment/min/moment.min.js"></script>
<script src="bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>
<script src="bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
<script src="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<script src="bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script>
<script src="bower_components/fastclick/lib/fastclick.js"></script>
<script src="dist/js/adminlte.min.js"></script>
<script src="dist/js/pages/dashboard.js"></script>
<script src="dist/js/demo.js"></script>
<script src="dist/js/jquery.validate.min.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script> 
<script src="bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
<script src="dist/js/jquery.validate.min.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<script>
  $(document).ready(function(){
    $("#table_director").load('table_director.php');
  });

  $(document).ready (function(){
            $("#success-alert").hide();
 });

</script>
<script>


var _URL = window.URL || window.webkitURL;
    $("#direc_image").change(function (e) {
    var file, img;
    if ((file = this.files[0])) {
        img = new Image();
        img.onload = function () {
          var width = this.width;
          var height = this.height;
          if((width != 736) || (height != 815)){
            $("#error_add_direc").html('<div class="alert alert-danger">Images size less than 736 pixal x 815 pixel</div>').fadeIn(1000).delay(5000).fadeOut(function(){  $("#table_client2").load('table_client.php'); }); 
              $("#direc_image").val("");
              return false;
            }
        };
        img.src = _URL.createObjectURL(file);
    }
    });

  $('#add_direc').validate({
      rules: {
        direc_name: {
                required: true,
            },
        direc_posi: {
            required: true,
        },          
        direc_image: {
            required: true,
        },

      },
      messages: {
          direc_name: {
              required: "<p style='color:red'>Please Insert Director Name</p>",
          },
          direc_posi: {
              required: "<p style='color:red'>Please Insert Director Position</p>",
          },          
          direc_image: {
              required: "<p style='color:red'>Please Insert Director Image</p>",
          },

      },
      submitHandler: function(form) { 
        var direc_name = $('#direc_name').val();
        var direc_posi = $('#direc_posi').val();
        var direc_image = $('#direc_image').prop('files')[0];   
        var form_data = new FormData();          
        form_data.append('file', direc_image);
        form_data.append('direc_posi', direc_posi);
        form_data.append('direc_name', direc_name);
                   
       
        $.ajax({
            url: "add_direc.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_direc").html('<div class="alert alert-success" id="success-alert"><strong>Success! </strong>Add Directors.</div>').delay(3000).fadeOut(function(){  $("#table_director").load('table_director.php'); }); 
              $("#table_director").load('table_director.php');
              $('#add_direc')[0].reset();
          }else{
            console.log(data);
              return false;
          }
        });
      }
    });
</script> 
</html>

© 2024 UnknownSec