如何使用html表中的行填充输入字段我想编辑 [英] How to fill input fields in form with data from row in html table I want to edit

查看:109
本文介绍了如何使用html表中的行填充输入字段我想编辑的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有这个带有MySQL数据库和窗体数据的HTML表格,用于在此表中添加/编辑行。如果我添加新行,一切工作正常,但是当我想编辑时,我不知道如何预先填写此表单中的输入文本字段。我有特定的行保存为每个编辑按钮的ID,但我不知道如何从这个点击的按钮知道ID。我应该用PHP或JS来完成它吗?

I have this HTML table with data from MySQL database and form for adding/editing rows in this table. If I add new row, everything works fine, but when I want to edit, I dont know how to pre-fill input text fields in this form. I have id of specific row saved as id of each editing button, but I dont know how to get know the ID from this clicked button. And should I have to do it with PHP or JS?

<table class="table table-striped">
                    <thead>
                    <tr>
                        <th> Poradi</th>
                        <th> Jmeno</th>
                        <th> Prijmeni</th>
                        <th> Adresa</th>
                        <th> Mesto</th>
                        <th> Telefon</th>
                        <th> Email</th>
                    </tr>
                    </thead>
                    <tbody>
                    <?php
                    $db = new PDO(
                        "mysql:host=localhost;dbname=xyz",
                        "xyz",
                        "xy"
                    );

                    $stmp = $db->prepare("SELECT * FROM user");
                    $stmp->execute();
                    $data = array();
                    while ($row = $stmp->fetch()) {
                        $data[]=($row);
                        echo "<tr>
                                <td>" . $row['id'] . "</td>
                                <td>" . $row['login'] . "</td>
                                <td>" . $row['password'] . "</td>
                                <td>" . $row['name'] . "</td>
                                <td>" . $row['surname'] . "</td>
                                <td>" . $row['address'] . "</td>
                                <td>" . $row['city'] . "</td>
                                <td>" . $row['phone'] . "</td>
                                <td>" . $row['email'] . "</td><td>";
                        $id = $row['id'];
                        echo "<a><i class='glyphicon glyphicon-pencil' id=$id></i></a></td>
                        </tr>";
                    }

                    ?>

                    </tbody>
                </table>


            </div>

            <div class="sideMenu">
                <form method="post" class="form-group" action="add.php">
                    <h1>Pridat servis</h1>
                    <input type="text" name="name" placeholder="Jmeno" required autofocus>
                    <input type="text" name="surname" placeholder="Prijmeni" required>
                    <input type="text" name="address" placeholder="Adresa" required>
                    <input type="text" name="city" placeholder="Mesto" required>
                    <input type="tel" name="phone" placeholder="Telefon" required>
                    <input type="email" name="email" placeholder="Email" required>

                    <div class="btn-toolbar">
                        <button class="btn" type="submit">Ulozit</button>
                        <button class="btn" type="button">Zrusit</button>
                    </div>
                </form>

                <div class="icon-close">
                    <img src="http://s3.amazonaws.com/codecademy-content/courses/ltp2/img/uber/close.png">
                </div>
            </div>


推荐答案

我找到了一个我正在寻找的解决方案。这里的人提出的建议是对的,以防万一它不介意你从你的网站重定向。

I found a solution I was looking for. Advices from guys here are right as well in case it never mind you redirect from your site.

我想用jQuery动态地做到这一点,如果可能的话,我发现这个解决方案对我来说很完美,所以我在这里分享它。

I wanted to do it dynamically with jQuery if it would be possible and I've found this solution which works for me perfect, so I share it here.

jQuery:通过点击按钮获取表格行的内容

这篇关于如何使用html表中的行填充输入字段我想编辑的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆