Как редактировать данные по клику и заполнять таблицу SQL новыми данными?

Question

Я создаю таблицу, и все мои данные заполнены правильно. То, чего я хочу достичь дальше, - это возможность редактировать поле «статус», щелкая по нему (нажимая на текст).

Я хочу получить изменение с помощью Javascript (или PHP, не имеет значения) и обновить мой SQL с новым статусом. Однако это не похоже на работу! Даже вводимый текст не отображается для редактирования поля состояния.

Я пытался сделать редактируемый диапазон с помощью contentEditable="true", но ничего не помогает. Что я делаю не так?

<table class="forms" align="center">
  <tr>
    <th class="text-center">Title</th>
    <th class="text-center">Status</th>
  </tr>
  <?php 
    while ($form = mysqli_fetch_assoc($forms_set)){ ?>
    <tr>
      <td>
        <a href="../form?id=<?php echo urlencode($form[" id "]);?>">
          <?php echo htmlentities($form["title"]); ?>
        </a>
      </td>
      <td><span id="form-status"><?php echo htmlentities($form["status"]);?></span></td>
    </tr>
  <?php } 
    mysqli_free_result($forms_set); ?>
</table>

$('#form-status').click(function() {
  var formStatus = $(this).text();
  $(this).html('');
  $('<input></input>')
    .attr({
      'type': 'text',
      'name': 'status',
      'id': 'txt_status',
      'size': '30',
      'value': formStatus
    })
    .appendTo('#form-status');
  $('#txt_status').focus();
});

$(document).on('blur', '#form-status', function() {
  var formStatus = $(this).val();
  $.ajax({
    type: 'post',
    url: 'admin?formStatus=' + formStatus,
    success: function() {
      $('#form-status').text(formStatus);
    }
  });
});