Кнопка Сохранить для загрузки в MySQL от JavaScript

Question

        <table>
          <tr>
            <th>20.00 - 21.00</th>
            <?php if ($senin20 == "-") {$kelas = "kosong";} else {$kelas = "biasa";}
            echo "<td class='$kelas'><span>"; echo $senin20; "</span></td>"; ?>
            <?php if ($selasa20 == "-") {$kelas = "kosong";} else {$kelas = "biasa";}
            echo "<td class='$kelas'><span>"; echo $selasa20; "</span></td>"; ?>
            <?php if ($rabu20 == "-") {$kelas = "kosong";} else {$kelas = "biasa";}
            echo "<td class='$kelas'><span>"; echo $rabu20; "</span></td>"; ?>
            <?php if ($kamis20 == "-") {$kelas = "kosong";} else {$kelas = "biasa";}
            echo "<td class='$kelas'><span>"; echo $kamis20; "</span></td>"; ?>
            <?php if ($jumat20 == "-") {$kelas = "kosong";} else {$kelas = "biasa";}
            echo "<td class='$kelas'><span>"; echo $jumat20; "</span></td>"; ?>
          </tr>
        </table>

        <script>
        // insert hidden input to each td element.
        document.querySelectorAll("table#timetable td").forEach(function(each) {
            let value = each.querySelector("span").innerText;
            each.innerHTML += `<input type="text" value="${value}" style="display: none;">`;

            // when user double click, hidden span and display input.
            each.addEventListener("dblclick", function(event) {
                each.querySelector("span").style.display = "none";
                each.querySelector("input").style.display = "initial";
                each.querySelector("input").focus();
            });

    // when user leave input (blur), hidden input and display span, and change span's innerText.
            each.querySelector("input").addEventListener("blur", function(event){
                each.querySelector("input").style.display = "none";
                each.querySelector("span").style.display = "initial";

                let value = each.querySelector("input").value;
                each.querySelector("span").innerText = value;
                });
            });
        </script>
        <br>

        <button id="save">Save</button>

    <br>

Я хочу создать кнопку сохранения, которая сохраняет ввод переменной value в JavaScript в моей базе данных.

Как сохранить value из JS в PHP Переменная ($senin20, $selasa20, $rabu20, $kamis20, $jumat20) и сохранение ее в базе данных?

Answer 1

ЮБ может получить HTML DOM и отправить его в БД с Ajax

var objdta={
 senin: document.getElementsByClassName("senin").value
}      
$.ajax({ 
                url:"save.php", 

                method:"POST", 

                data:objdta, 

                dataType:"json"});