Javascript 数据库的输出使用切换来编辑数据

我有一个带有一些记录的数据库，我使用php在页面上输出这些记录。这一切都很好，但我希望能够编辑输出的信息使用切换功能。因此，基本上，当单击按钮编辑时，我会输出文本，我希望切换特定的表，并再次显示信息，但随后以输入形式显示

   foreach( $result as $row2 )

     $div = $row2['id'] ;

    echo "<div id='d$div; '><table ><tr><td>" . 'Categorie: ' . '</td><td> ' . $row2['name'] .  '</td></tr>' 
. '<tr><td>' . 'Omschrijving: ' . '</td><td>' . $row2['comments'] . '</td></tr> . '<tr><td>' . '<button id="e1">' . 'Edit' . '</button>' . '</td></tr>' .  ' </table><hr>'; } ?></p>

foreach（$结果为$row2）
$div=$row2['id']；
回声“.”类别：'.'''$第2行['name'].'
. '' . 'Omschrijving:“.”$第2行[“注释”。”编辑“.”
'；}？>

如果我这样做的话，我会使用

输入字段再次将所有内容回显出来，并将其用作div id f$div，每个记录都将获得其唯一的id

   foreach( $result as $row2 )

     $di = $row2['id'] ;

    echo "<div id='f$di; '><table ><tr><td>" . 'Categorie: ' . '</td><td> ' . $row2['name'] .  '</td></tr>' 
. '<tr><td>' . 'Omschrijving: ' . '</td><td>' . $row2['comments'] . '</td></tr> . '<tr><td>' . '<button id="e2">' . 'Safe' . '</button>' . '</td></tr>' .  ' </table><hr>'; } ?></p>

foreach（$结果为$row2）
$di=$row2['id']；
回声“.”类别：'.'''$第2行['name'].'
. '' . 'Omschrijving:“.”$第2行[“注释”。”安全
'；}？>

然后我会切换它，但我没有ID，因为它们仍然需要生成。我该怎么做呢？点击功能也是如此，但我可以用同样的方式为它们生成一个id

<script>

    $('#e1,#e2').click(function () {
    $('#d?,#f?').toggle();

})          
 </script>

$（'#e1，#e2'）。单击（函数（）{
$（'#d？，#f？）.toggle（）；
})          

您也可以使用javascript实现这一点。这是一个例子。您甚至可以使用AJAX进行更新，否则您可以更新数据库中的数据并返回到同一页面

        <?php
    foreach($result as $row2) {
        $div = $row2['id'];
        echo "<div id='d$div'><table ><tr><td>" . "Categorie: " . "</td><td> " . $row2["name"] .  "</td></tr>" . "<tr><td>" . "Omschrijving: " . "</td><td>" . $row2["comments"] . "</td></tr>" . "<tr><td>" . "<button id=e$div onclick='makeForm(\"$div\",\"d$div\",\"$row2[name]\",\"$row2[comments]\")';>" . "Edit" . "</button>" . "</td></tr>" .  "</table><hr></div>\n"; 
    }
    ?>

        <script>

        function makeForm(id,mydiv,category,comment){
                var div = document.getElementById(mydiv);
                var divHTML = "<form action='update.php' method='POST'><table> <tr><td>Categorie: </td> <td><input type='text' name='cat_" +id+ "' value='"+category + "' /></td></tr> <tr> <td>Omschrijving:</td> <td><input type='text' name='comment_" +id+ "' value='"+comment+"' /></td></tr> <tr><td> <input type='submit' value='Safe'></td><td><button onclick='removeForm(\""+id+"\",\""+mydiv+"\",\""+category +"\",\" "+comment+"\" ); return false;'>Cancel</button></td></tr></table> </form><hr>";

                div.innerHTML = divHTML;

                }
                function removeForm(id,mydiv,category,comment){
                    var div = document.getElementById(mydiv);
                    var divHTML = "<table> <tr><td>Categorie: </td> <td>"+category + "</td></tr> <tr> <td>Omschrijving:</td> <td>"+comment+"</td></tr> <tr><td><button onclick='makeForm(\""+id+"\",\""+mydiv+"\",\""+category +"\",\" "+comment+"\" ); '>Edit</button></td></tr></table><hr>";

                    div.innerHTML = divHTML;
                }    

    </script>

---

请更加明确。