javascript — перетащите ячейки таблицы с автосохранением

Я пытаюсь манипулировать динамически сгенерированной таблицей. На данный момент я использую таблицу с редактируемым содержимым ТД. База данных обновляется с помощью следующего вызова AJAX …

$(document).ready(function(){
$("td[contenteditable=true]").blur(function(){
var msg = $(".alert");
var newvalue = $(this).text();
var field = $(this).attr("id");
$.post("fn-scp-update.php",field+"="+newvalue,function(d){
var data = JSON.parse(d);

});
});
});

Со следующими в td элементами для скрипта можно найти ….

        echo '<td contenteditable="true" id="due_date:'.$row['id'].'">'.$date_display.'</td>';

Данные разделяются на отдельные PHP-скрипты, и БД обновляется …

foreach($_POST as $key=>$value){
$key = strip_tags(trim($key));
$value = strip_tags(trim($value));
$explode = explode(":",$key);
$user_id = $explode[1];
$field_name = $explode[0];
if(isset($user_id)){
if($field_name == 'due_date'){
$date = new DateTime($value);
$value = $date->format('Y-m-d');
}
elseif($field_name == 'pend_notes'){
$value=$conn->real_escape_string($value);
}
$update = $conn->query("UPDATE su_master SET $field_name='{$value}' WHERE id='$user_id'");
if($update){
$response = "Details Updated";
http_response_code(200); //Setting HTTP Code to 200 i.e OK
}else{
$response = "Not Modified";
http_response_code(304); //Setting HTTP Code to 304 i.e Not Modified
}
}else{
$response = "Not Acceptable";
}
}
}

В какой-то момент я займусь созданием PDO с функцией db.

Внутри td выбирается идентификатор, первая часть которого представляет собой имя столбца, идентификатор для ссылки на строку, а затем данные обновляются.

Все это работает очень хорошо, однако теперь у меня есть просьба сделать содержимое ячеек перетаскиваемым. По сути, если что-то уже записано в contenteditable ячейке, оно должно иметь возможность перетаскивания в другую contenteditable ячейку и данные, записанные в базу данных таким же образом, как и текущая. Или, по крайней мере, работать точно так же, не обязательно дословно копировать текущий код.

Учитывая, что я даже не знаю, с чего начать, это сделало поиск в Google невероятно трудным.

Я попытался обернуть содержимое ячейки в промежуток, который сам по себе был перетаскиваемым. Который работал, но не тогда, когда ячейка была редактируемой.

Я уверен, что проблема в том, что я использую размытие, что означает, что запись в db не записывается до тех пор, пока я не отпущу мышь или не нажму в другом месте. Если это в другом месте находится в другой камере, это портит падение.

3 дня и без разрешения помогите пожалуйста 🙁

Резюме … редактируемые и перетаскиваемые ячейки.

Следует также отметить, что все это содержится в одной таблице, поэтому ограничено одним элементом таблицы.