0
Я делаю таблицу в HTML, которая принимает пользовательский ввод и сохраняет его на сервере Ajax. Когда страница обновляется, вновь вводимый текст все еще присутствует. Однако, когда кто-то на другом компьютере/телефоне и т. Д. Просматривает таблицу на моем веб-сайте, изменения, которые кто-то еще сделал на своем устройстве, не доступны для просмотра. Другими словами, есть ли способ разрешить пользователям динамически редактировать контент в таблице на веб-сайте, а затем делать эту информацию видимой для каждого человека, посетившего веб-сайт?Сохранение на сервере Ajax
У меня есть минимальный опыт работы в JS, поэтому более подробные объяснения были бы полезны! Спасибо! Код в HTML и CSS прилагается ниже:
td, table tr, th {
border: 1px solid Black;
border-collapse: collapse;
}<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="WorkLog.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<meta charset="UTF-8">
<title>Work Log</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<h1>Work Log Template</h1>
<table id=WorkLog contenteditable=true>
<tr>
<th>Item</th>
<th>Estimated Length</th>
<th>Comments/Brief Summary (optional)</th>
<th>Actions</th>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td><input type="button" class="BtnPlus" value="+" /><input type="button" class="BtnMinus" value="-" /></td>
</tr>
</table>
<script type="text/javascript">
$(document).ready(function() {
function addRow() {
var html = '<tr>' +
'<td>new item</td>' +
'<td></td>' +
'<td></td>' +
'<td><input type="button" class="BtnPlus" value="+" /><input type="button" class="BtnMinus" value="-" /></td>' +
'</tr>'
$(html).appendTo($("#WorkLog"))
};
$("#WorkLog").on("click", ".BtnPlus", addRow);
});
</script>
<script>
function deleteRow() {
var par = $(this).closest('TR');
par.remove();
};
$("#WorkLog").on("click", ".BtnMinus", deleteRow);
</script>
<script>
$(document).ready(function(){
$("#WorkLog").blur(function() {
localStorage.setItem('WorkLogsData', this.innerHTML);
});
if (localStorage.getItem('WorkLogsData')) {
$("#WorkLog").html(localStorage.getItem('WorkLogsData'));
}
});
</script>
</body>
</html>
'localStorage' принадлежит к браузеру. Если вы хотите, чтобы другие пользователи видели данные, вам необходимо сохранить эти данные на стороне сервера (в DB или текстовом файле) и обслуживать людей. –