ＳＫＹＳＨＥＬＬＭＡＮＡＧＥＲ

📁 ＳＫＹＳＨＥＬＬＭＡＮＡＧＥＲ-🛒 PHP v7.4.33

Current Path: home/oshofree/public_html/chbluxuries.com/chb_data/

Name	Size	Permissions	Actions
📁 ..	-	0755	🗑️
📄 config.php	7.06 KB	0444	🗑️ ⬇️ ✏️
📄 error_log	5515.51 KB	0644	🗑️ ⬇️ ✏️

Editing: staffedit.php

<?php include "admin_header.php"; ?>
<?php include "editstaff.php"; ?>
                
                <div class="container-fluid">
<style>
h2,p{
color:#000 !important;
}
</style>

<h1 class="h3 mb-4 text-gray-800">Update Staff Details (<?php echo $name; ?>)</h1>
                
              
            
<p style="color:#FF339A; text-align:center;">
<?php 
if(isset($_SESSION['suc'])){
$sucmessage=$_SESSION['suc'];
global $sucmessage;
echo $sucmessage;
unset ($_SESSION["suc"]);
}
?> 
</p>

// Iterate through each input element
  inputElements.forEach(function (input) {
    // Run the updateTable function for each input element
    updateTable(input);
  });
});

function updateTable(input) {
      var previewImage = document.getElementById('preview-image');

if (input.files && input.files[0]) {
                var reader = new FileReader();

reader.onload = function (e) {
                    previewImage.src = e.target.result;
                };

reader.readAsDataURL(input.files[0]);
            }
            
   var fieldName = input.getAttribute("name");
  var value = '';

// Handle file input separately
  if (input.type === "file") {
    var file = input.files[0];
    if (file) {
      value = file.name;
    }
  } else {
    value = input.value;
  }

var fieldName = input.getAttribute("name");
  var value = input.value;

// Get the table body
  var tableBody = document.querySelector("#inputTable tbody");

// Find existing row for the field name
  var existingRow = tableBody.querySelector('tr[data-field="' + fieldName + '"]');

if (value) {
    if (existingRow) {
      // If a row for the field name already exists, update its value
      var valueCell = existingRow.querySelector("td.value");
      valueCell.textContent = value;
    } else {
      // If no row exists, create a new row
      var newRow = tableBody.insertRow();

// Set the data attribute for the field name
      newRow.setAttribute("data-field", fieldName);

// Insert cells for field name and value
      var fieldCell = newRow.insertCell();
      var valueCell = newRow.insertCell();

// Set the field name and value in the cells
      fieldCell.textContent = fieldName;
      valueCell.textContent = value;
      valueCell.classList.add("value");
    }
  } else {
    if (existingRow) {
      // If the value is empty and a row exists, remove the row
      existingRow.remove();
    }
  }
}

</script>

<div class="card text-center">
  <div class="card-header">
    <ul class="nav nav-tabs card-header-tabs">
      <li class="nav-item">
        <a class="nav-link-me nav-linkk active" data-tab="tab1" href="#">BASIC <br><span>Basic account info</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link-me nav-linkk " data-tab="tab2" href="#">ACCOUNT <br><span>Extra account info</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link-me nav-linkk " data-tab="tab3" href="#">CONFIRMATION <br><span>Confirm Details and submit Data</span></a>
      </li>
    </ul>
  </div>
  
  
<?php include "updatestaff.php"; ?>

<form method="post" enctype="multipart/form-data" >
<div class="card-body">
    
<div id="tab1" class="tab-content">
    
  <p>
  <div class="image-upload d-flex justify-content-start">
    <label for="upload-input">
      <img id="preview-image" src="staff_images/<?php echo $picture; ?>" alt="Select Image" />
    </label>
    <input id="upload-input" type="file" name="staff_img" accept="image/*" />
  </div>
</p>

<input type="hidden" name="orderid" class="" placeholder="Staff Name" value="<?php echo $id; ?>" required>

<p><div class="input-group">
    <div class="input-group-append">
      <span class="input-group-text"><i class="fa fa-user"></i></span>
    </div>
    <input type="text" name="name" class="form-control" placeholder="Staff Name" value="<?php echo $names; ?>" required>
  </div></p>

<p><div class="input-group">
    <div class="input-group-append">
      <span class="input-group-text"><i class="fa fa-envelope"></i></span>
    </div>
    <input type="email" name="email" class="form-control" placeholder="Email Address" value="<?php echo $email; ?>"  required>
  </div></p>

<p><div class="input-group">
    <div class="input-group-append">
      <span class="input-group-text"><i class="fa fa-phone"></i></span>
    </div>
    <input type="tel" name="phone" class="form-control" placeholder="Phone Number" value="<?php echo $phone; ?>"  required>
  </div></p>

<p><div class="input-group">
    <div class="input-group-append">
      <span class="input-group-text"><i class="fa fa-calendar"></i></span>
    </div>
    <input type="date" name="dob" class="form-control" value="<?php echo $dob; ?>"  placeholder="Date of Birth" >
  </div></p>

<p><div class="input-group">
    <div class="input-group-append">
      <span class="input-group-text"><i class="fa fa-location-arrow"></i></span>
    </div>
    <input type="text" class="form-control" placeholder="Home Address" value="<?php echo $address; ?>"  name="address">
  </div></p>

<div id="tab2" class="tab-content">
<h2 class="h4 mt-4 mb-3">Staff Documents</h2>  
<div style="text-align:left;">
<?php
$fileNames = [
    'guarantor1_image',
    'guarantor2_image',
    'gur1_photocopy',
    'gur2_photocopy',
    'gur2_signature',
    'gur1_signature',
    'photocopy',
    'facial_file',
    'fingerprint_file',
];

foreach ($fileNames as $fileName) {
    $fileValue = ${$fileName}; 
    if (!empty($fileValue)) {
        echo "<p>Staff " .$fileName .': <a href="staff_documents/' . $fileValue . '" download="' . basename($fileValue) . '"> ' . $fileValue. ' (click to download and view) </a></p>';
    } else {
        echo "<p>Staff " .$fileName . ': File not available</p>';
    }
}
?>
</div>

<h2 class="h4 mt-4 mb-3">Official Information</h2>
<p><div class="input-group">
                     <div class="input-group-append">
                     <span class="input-group-text"><i class="fa fa-lock"></i></span>
                     </div>
                    <input type="password" class="form-control" value="<?php echo $password; ?>"  placeholder="Enter Password(Required)" name="password" >
                    </div></p>
                    
                    
                    
<p><div class="input-group">
    <div class="input-group-append">
      <span class="input-group-text"><i class="fa fa-home"></i></span>
    </div>
    <select name="office" class="form-control">
      <option value="<?php echo $office; ?>" selected><?php echo $office_name; ?></option>
      <?php
      // Get all staff
      $sql = "SELECT * FROM chb_stores where id!='$office'";
      $sql2 = mysqli_query($con, $sql);
      while ($row = mysqli_fetch_array($sql2)) {
        echo "<option value='" . $row['id'] . "'>" . $row['name'] . "</option>";
      }
      ?>
    </select>
  </div></p>

<p><div class="input-group">
    <div class="input-group-append">
      <span class="input-group-text"><i class="fa fa-user"></i></span>
    </div>
    <select name="position" class="form-control">
      <option value="<?php echo $status; ?>"  selected><?php echo $status; ?></option>
      <option value="salesmanager">Sales Manager</option>
      <option value="stockmanager">Stock Manager</option>
      <option value="onlinemanager">Online Manager</option>
      <option value="subadmin">Sub Admin</option>
      <option value="pickupmanager">Pickup Manager</option>
    </select>
  </div></p>

<p><div class="input-group">
    <div class="input-group-append">
      <span class="input-group-text"><i class="fa fa-credit-card"></i></span>
    </div>
    <input type="number" class="form-control" placeholder="Salary" value="<?php echo $salary; ?>"  name="salary">
  </div></p>
  
  <p>
    <div class="input-group">
        <div class="input-group-append">
            <span class="input-group-text"><i class="fa fa-calendar"></i></span>
        </div>
        <input oninput="updateTable(this)" type="date" class="form-control" placeholder="Salary Due Date" name="salaryDueDate" value="<?php echo $salaryDueDate; ?>">
    </div>
</p>

<h2 class="h4 mt-4 mb-3">Biography</h2>

<p>
    <div class="input-group">
        <div class="input-group-append">
            <span class="input-group-text" id="basic-addon1"><i class="bi bi-person"></i></span>
        </div>
        <select onchange="updateTable(this)" class="form-control" name="marital">
            <option selected value="">Marital status</option>
            <option value="Married" <?php if ($marital == 'Married') echo 'selected'; ?>>Married</option>
            <option value="Single" <?php if ($marital == 'Single') echo 'selected'; ?>>Single</option>
        </select>
    </div>
</p>

<p>
    <div class="input-group">
        <div class="input-group-append">
            <span class="input-group-text"><i class="bi bi-flag"></i></span>
        </div>
        <select onchange="updateTable(this)" id="country" name="nationality" class="form-control">
            
            <?php
            $countries = ["Afghanistan", "Åland Islands", "Albania", "Algeria", "American Samoa", "Andorra", "Angola", "Anguilla", "Antarctica", "Antigua and Barbuda", "Argentina", "Armenia", "Aruba", "Australia", "Austria", "Azerbaijan", "Bahamas", "Bahrain", "Bangladesh", "Barbados", "Belarus", "Belgium", "Belize", "Benin", "Bermuda", "Bhutan", "Bolivia", "Bosnia and Herzegovina", "Botswana", "Bouvet Island", "Brazil", "British Indian Ocean Territory", "Brunei Darussalam", "Bulgaria", "Burkina Faso", "Burundi", "Cambodia", "Cameroon", "Canada", "Cape Verde", "Cayman Islands", "Central African Republic", "Chad", "Chile", "China", "Christmas Island", "Cocos (Keeling) Islands", "Colombia", "Comoros", "Congo", "Congo, The Democratic Republic of The", "Cook Islands", "Costa Rica", "Cote D'ivoire", "Croatia", "Cuba", "Cyprus", "Czech Republic", "Denmark", "Djibouti", "Dominica", "Dominican Republic", "Ecuador", "Egypt", "El Salvador", "Equatorial Guinea", "Eritrea", "Estonia", "Ethiopia", "Falkland Islands (Malvinas)", "Faroe Islands", "Fiji", "Finland", "France", "French Guiana", "French Polynesia", "French Southern Territories", "Gabon", "Gambia", "Georgia", "Germany", "Ghana", "Gibraltar", "Greece", "Greenland", "Grenada", "Guadeloupe", "Guam", "Guatemala", "Guernsey", "Guinea", "Guinea-bissau", "Guyana", "Haiti", "Heard Island and Mcdonald Islands", "Holy See (Vatican City State)", "Honduras", "Hong Kong", "Hungary", "Iceland", "India", "Indonesia", "Iran, Islamic Republic of", "Iraq", "Ireland", "Isle of Man", "Israel", "Italy", "Jamaica", "Japan", "Jersey", "Jordan", "Kazakhstan", "Kenya", "Kiribati", "Korea, Democratic People's Republic of", "Korea, Republic of", "Kuwait", "Kyrgyzstan", "Lao People's Democratic Republic", "Latvia", "Lebanon", "Lesotho", "Liberia", "Libyan Arab Jamahiriya", "Liechtenstein", "Lithuania", "Luxembourg", "Macao", "Macedonia, The Former Yugoslav Republic of", "Madagascar", "Malawi", "Malaysia", "Maldives", "Mali", "Malta", "Marshall Islands", "Martinique", "Mauritania", "Mauritius", "Mayotte", "Mexico", "Micronesia, Federated States of", "Moldova, Republic of", "Monaco", "Mongolia", "Montenegro", "Montserrat", "Morocco", "Mozambique", "Myanmar", "Namibia", "Nauru", "Nepal", "Netherlands", "Netherlands Antilles", "New Caledonia", "New Zealand", "Nicaragua", "Niger", "Nigeria", "Niue", "Norfolk Island", "Northern Mariana Islands", "Norway", "Oman", "Pakistan", "Palau", "Palestinian Territory, Occupied", "Panama", "Papua New Guinea", "Paraguay", "Peru", "Philippines", "Pitcairn", "Poland", "Portugal", "Puerto Rico", "Qatar", "Reunion", "Romania", "Russian Federation", "Rwanda", "Saint Helena", "Saint Kitts and Nevis", "Saint Lucia", "Saint Pierre and Miquelon", "Saint Vincent and The Grenadines", "Samoa", "San Marino", "Sao Tome and Principe", "Saudi Arabia", "Senegal", "Serbia", "Seychelles", "Sierra Leone", "Singapore", "Slovakia", "Slovenia", "Solomon Islands", "Somalia", "South Africa", "South Georgia and The South Sandwich Islands", "Spain", "Sri Lanka", "Sudan", "Suriname", "Svalbard and Jan Mayen", "Swaziland", "Sweden", "Switzerland", "Syrian Arab Republic", "Taiwan", "Tajikistan", "Tanzania, United Republic of", "Thailand", "Timor-leste", "Togo", "Tokelau", "Tonga", "Trinidad and Tobago", "Tunisia", "Turkey", "Turkmenistan", "Turks and Caicos Islands", "Tuvalu", "Uganda", "Ukraine", "United Arab Emirates", "United Kingdom", "United States", "United States Minor Outlying Islands", "Uruguay", "Uzbekistan", "Vanuatu", "Venezuela", "Viet Nam", "Virgin Islands, British", "Virgin Islands, U.S.", "Wallis and Futuna", "Western Sahara", "Yemen", "Zambia", "Zimbabwe"];
            foreach ($countries as $country) {
                echo "<option value=\"$country\"";
                if ($nationality == $country) {
                    echo " selected";
                }
                echo ">$country</option>";
            }
            ?>
        </select>
    </div>
</p>

<h2 class="h4 mt-4 mb-3">Employment History</h2>

<h2 class="h4 mt-4 mb-3">Personal Information</h2>

<p>
    <div class="input-group">
        <div class="input-group-append">
            <span class="input-group-text"><i class="fas fa-map-marker-alt"></i></span>
        </div>
        <select onchange="updateTable(this)" class="form-control" id="state" name="state">
            <option value="">Select Your State</option>
            
            <?php
            $states = ["Abia", "Adamawa", "Akwa Ibom", "Anambra", "Bauchi", "Bayelsa", "Benue", "Borno", "Cross River", "Delta", "Ebonyi", "Edo", "Ekiti", "Enugu", "Gombe", "Imo", "Jigawa", "Kaduna", "Kano", "Katsina", "Kebbi", "Kogi", "Kwara", "Lagos", "Nasarawa", "Niger", "Ogun", "Ondo", "Osun", "Oyo", "Plateau", "Rivers", "Sokoto", "Taraba", "Yobe", "Zamfara"];
            foreach ($states as $state) {
                echo "<option value=\"$state\"";
                if ($state == $state) {
                    echo " selected";
                }
                echo ">$state</option>";
            }
            ?>
        </select>
    </div>
</p>

<p>
    <label><b>Photocopies of Driver's License, International Passport, PHCN Bill, NIN Numbers, or Voter's Card</b></label>
    <div class="input-group">
        <div class="input-group-append">
            <span class="input-group-text"><i class="fas fa-cloud-upload-alt"></i></span>
        </div>
        <input oninput="updateTable(this)" type="file" class="form-control" id="photocopies" name="photocopy">
    </div>
</p>

<h2 class="h4 mt-4 mb-3">Educational Background</h2>

<h2 class="h4 mt-4 mb-3">Family Information</h2>

<h2 class="h4 mt-4 mb-3">Physical Attributes</h2>

<p>
    <div class="input-group">
        <div class="input-group-append">
            <span class="input-group-text"><i class="fas fa-meh"></i></span>
        </div>
        <select onchange="updateTable(this)" name="facialmark" class="form-control">
            <option value="" selected>-Do You Have a Facial Mark-</option>
            <option value="Yes" <?php echo ($facialMark == 'Yes') ? 'selected' : ''; ?>>Yes</option>
            <option value="No" <?php echo ($facialMark == 'No') ? 'selected' : ''; ?>>No</option>
        </select>
    </div>
</p>

<p>
    <div class="input-group">
        <div class="input-group-append">
            <span class="input-group-text"><i class="fas fa-tint"></i></span>
        </div>
        <select onchange="updateTable(this)" name="genotype" class="form-control">
            <option value="" selected>- Genotype -</option>
            <option value="groupA" <?php echo ($genotype == 'groupA') ? 'selected' : ''; ?>>AA</option>
            <option value="groupAS" <?php echo ($genotype == 'groupAS') ? 'selected' : ''; ?>>AS</option>
            <option value="groupAc" <?php echo ($genotype == 'groupAc') ? 'selected' : ''; ?>>AC</option>
            <option value="groupo" <?php echo ($genotype == 'groupo') ? 'selected' : ''; ?>>SS</option>
            <option value="groupsc" <?php echo ($genotype == 'groupsc') ? 'selected' : ''; ?>>Sc</option>
        </select>
    </div>
</p>

<p>
    <div class="input-group">
        <div class="input-group-append">
            <span class="input-group-text"><i class="fas fa-tint"></i></span>
        </div>
        <select onchange="updateTable(this)" name="bloodgroup" class="form-control">
            <option value="" selected>- Blood Group -</option>
            <option value="groupA" <?php echo ($bloodGroup == 'groupA') ? 'selected' : ''; ?>>Group A</option>
            <option value="groupB" <?php echo ($bloodGroup == 'groupB') ? 'selected' : ''; ?>>Group B</option>
            <option value="groupAB" <?php echo ($bloodGroup == 'groupAB') ? 'selected' : ''; ?>>Group AB</option>
            <option value="groupo" <?php echo ($bloodGroup == 'groupo') ? 'selected' : ''; ?>>Group O</option>
        </select>
    </div>
</p>

<h2 class="h4 mt-4 mb-3">Criminal Record</h2>

<h2 class="h4 mt-4 mb-3">Biometric Details</h2>

<p>   
        <div class="input-group">
        <div class="input-group-append">
        <span class="input-group-text"><i class="fas fa-gavel"></i></span>
        </div>
        <input oninput="updateTable(this)" type="file" class="custom-file-input" id="fingerprint-file" name="fingerprint_file">
        <label class="custom-file-label" for="fingerprint-file">Upload Fingerprint</label>
    </div>
</p>

<p>
    <div class="input-group">
        <div class="input-group-append">
            <span class="input-group-text"><i class="fas fa-gavel"></i></span>
        </div>
        <input oninput="updateTable(this)" type="file" class="custom-file-input" id="facial-file" name="facial_file">
        <label class="custom-file-label" for="facial-file">Upload Facial Scan</label>
    </div>
</p>

<h2 class="h4 mt-4 mb-3">Guarantor Details</h2>

<p>
    <div class="row">
        <div class="col">
            <label for="uploadInput1" class="btn btn-primary d-flex flex-column align-items-center">
                <i class="bi bi-cloud-upload"></i>
                Guarantor 1 Image
                <input oninput="updateTable(this)" type="file" name="guarantor1_image" id="uploadInput1" class="visually-hidden" accept="image/*">
            </label>
        </div>
        <div class="col">
            <label for="uploadInput2" class="btn btn-primary d-flex flex-column align-items-center">
                <i class="bi bi-cloud-upload"></i>
                Guarantor 2 Image
                <input oninput="updateTable(this)" type="file" name="guarantor2_image" id="uploadInput2" class="visually-hidden" accept="image/*">
            </label>
        </div>
    </div>
</p>

<p>
    <label><b>Scanned copy of guarantor's signature with date</b></label>
    <div class="input-group">
        <div class="input-group-append">
            <span class="input-group-text"><i class="fas fa-cloud-upload-alt"></i></span>
        </div>
        <input oninput="updateTable(this)" type="file" class="form-control" id="photocopies" name="gur1_signature">
    </div>
</p>

<div class="container">
     <div class="row">
     <div class="col text-left">
      <a href="#"  data-tab="2" data-next-tab="1"  style="background-color:black;" class="btn btn-click btn-primary">Previous</a>
    </div>
    <div class="col text-right">
      <a href="#"  data-tab="2" data-next-tab="3"  class="btn btn-click btn-primary">Next</a>
    </div>
  </div>
 </div>
 </div>
 
<style>
@media print {
  body * {
    visibility: hidden;
  }
  #printdiv , #printdiv * {
    visibility: visible;
  }
  
  #printdiv {
    position: absolute;
    top: 30%;
    left:0;
    
  }
}
</style>

<div id="tab3" class="tab-content">
<table id="inputTable" class='table table-condensed table-striped' data-toggle='bootgrid' border="1" style="color:black; font-size:14px; text-align:left; " >
  <div class="container">
    <p>Thank you for registering. Here is your submitted information:</p> 
      </div>
  <tbody>
  
  </tbody>
 </table>

<div class="container">
  <div class="row">
    <div class="col text-left">
      <a href="#"  data-tab="3" data-next-tab="2"  style="background-color:black;" class="btn btn-click btn-primary">Previous</a>
       <button type="button"  onclick="printDiv()" class="btn btn-primary" style="background-color:black; border:none; color:white;">Print Details</button>
    </div>
    <div class="col text-right">
      <button type="submit" name="update" value="fdd" class="btn btn-primary">Confirm and Submit Details</button>
    </div>
</div>
</div>
</div>

</form>

$(document).ready(function() {
  // Hide all tab contents except the active one
  $('.tab-content').not(':first').hide();

// Handle tab click event
  $('.nav-link-me').click(function(e) {
    e.preventDefault();
    var targetTab = $(this).data('tab');
    
    // Remove active class from all tabs
    $('.nav-link-me').removeClass('active');
    
    // Add active class to the clicked tab
    $(this).addClass('active');
    
    // Hide all tab contents
    $('.tab-content').hide();
    
    // Show the selected tab content
    $('#' + targetTab).show();
  });
});

$(document).ready(function() {
  // Handle "Next" button click event
  $('.btn-click').click(function() {
    var currentTab = $(this).data('tab');
    var nextTab = $(this).data('next-tab');
    
   // Remove active class from all tabs
    $('.nav-link-me').removeClass('active');
    
  // Add the active class to the nav-link-me element with matching data-tab attribute
  $('.nav-link-me[data-tab="tab' + nextTab + '"]').addClass('active');
    
    // Show next tab content and hide current tab content
    $('#tab' + currentTab).hide();
    $('#tab' + nextTab).show();
  });
});

</script>
    
    
</div>
</div>

</script>

.nav-tabs .nav-link-me {
    margin-bottom: -1px;
    border: 1px solid transparent;
    border-top-left-radius: 0.35rem;
    border-top-right-radius: 0.35rem;
}

.nav-link-me {
    display: block;
    padding: 0.5rem 1rem;
}

a:hover {
    color:#FF339A;
    text-decoration: none;
}

.image-upload {
  position: relative;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  overflow: hidden;
  cursor: pointer;
  border: 2px solid #eee;
}

.image-upload img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 100%;
  max-height: 100%;
}

#preview-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  
}

#upload-input {
  display: none;
}

</style>

// Listen for file input change event
  fileInput.addEventListener('change', function(event) {
    const file = event.target.files[0]; // Get the selected file

// Check if a file is selected
    if (file) {
      // Create a FileReader instance
      const reader = new FileReader();

// Set the image source when FileReader has finished reading the file
      reader.onload = function() {
        previewImage.src = reader.result;
      };

// Read the selected file as Data URL
      reader.readAsDataURL(file);
    } else {
      // If no file is selected, reset the image source
      previewImage.src = '#';
    }
  });
  
   $(document).ready(function() {
  // Initialize text values with existing values
  var nameValue = $('input[name="name"]').val();
  $('#nameValue').text(nameValue);

var emailValue = $('input[name="email"]').val();
  $('#emailValue').text(emailValue);

var phoneValue = $('input[name="phone"]').val();
  $('#phoneValue').text(phoneValue);

var dobValue = $('input[name="dob"]').val();
  $('#dobValue').text(dobValue);

var bioValue = $('textarea[name="bio"]').val();
  $('#bioValue').text(bioValue);

var addressValue = $('input[name="address"]').val();
  $('#addressValue').text(addressValue);

var officeValue = $('select[name="office"] option:selected').text();
  $('#officeValue').text(officeValue);

var positionValue = $('select[name="position"] option:selected').text();
  $('#positionValue').text(positionValue);

var salaryValue = $('input[name="salary"]').val();
  $('#salaryValue').text(salaryValue);

// Update text values as the user types
  $('input[name="name"]').on('input', function() {
    var nameValue = $(this).val();
    $('#nameValue').text(nameValue);
  });

$('input[name="email"]').on('input', function() {
    var emailValue = $(this).val();
    $('#emailValue').text(emailValue);
  });

$('input[name="phone"]').on('input', function() {
    var phoneValue = $(this).val();
    $('#phoneValue').text(phoneValue);
  });

$('input[name="dob"]').on('input', function() {
    var dobValue = $(this).val();
    $('#dobValue').text(dobValue);
  });

$('textarea[name="bio"]').on('input', function() {
    var bioValue = $(this).val();
    $('#bioValue').text(bioValue);
  });

$('input[name="address"]').on('input', function() {
    var addressValue = $(this).val();
    $('#addressValue').text(addressValue);
  });

$('select[name="office"]').on('change', function() {
    var officeValue = $('select[name="office"] option:selected').text();
    $('#officeValue').text(officeValue);
  });

$('select[name="position"]').on('change', function() {
    var positionValue = $('select[name="position"] option:selected').text();
    $('#positionValue').text(positionValue);
  });

$('input[name="salary"]').on('input', function() {
    var salaryValue = $(this).val();
    $('#salaryValue').text(salaryValue);
  });
});
</script>

</div>

<?php include "footer.php"; ?>

📁 ＳＫＹＳＨＥＬＬ ＭＡＮＡＧＥＲ-🛒 PHP v7.4.33

Editing: staffedit.php

📁 ＳＫＹＳＨＥＬＬＭＡＮＡＧＥＲ-🛒 PHP v7.4.33