0

我的 PHP 脚本会生成一个表格,其中包含可以选择编辑或删除的行。也有可能创建一个新行。

我很难弄清楚如何更新通过 PHP 生成并通过 jQuery 插入的 HTML 行。更新后它必须仍然是可编辑的。HTML 被生成到一个 div 中。

  1. jQuery(插入生成的 HTML/等待操作)

  2. PHP(生成 html)

  3. 返回步骤 1)

(编辑:更正错误并更改脚本以回答)

PHP

require_once "../../includes/constants.php";

// Connect to the database as necessary
$dbh = mysql_connect(DB_SERVER, DB_USER, DB_PASSWORD) or die("Unaable to connnect to MySQL");

$selected = mysql_select_db(DB_NAME, $dbh) or die("Could not select printerweb");

$action = $_POST['action'];
$name = $_POST['name'];
$id = $_POST['id'];

if ($action == "new") {
    mysql_query("INSERT INTO place (id, name) VALUES (NULL, $name)");
}
elseif ($action == "edit") {
    mysql_query("UPDATE place SET name = $name WHERE id = $id");
}
elseif ($action == "delete") {
    mysql_query("DELETE FROM place WHERE id = $id");
}

echo "<table><tbody>";
$result = mysql_query("SELECT * FROM place");
while ($row = mysql_fetch_array($result)) {
    echo "<tr><td id=" . $row["id"] . " class=inputfield_td><input class=inputfield_place type=text value=" . $row["name"] . " /></td><td class=place_name>" . $row["name"] . "</td><td class=edit>edit</td><td class=cancel>cancel</td><td class=delete>delete</td><td class=save>SAVE</td></tr> \n";
}
echo "</tbody>";
echo "</table>";
echo "<input type=text class=inputfield_visible />";
echo "<button class=new>Neu</button>";

JS

$(function() {
    $.ajax({
        url: "place/place_list.php",
        cache: false,
        success: function(html) {
            $("#place_container").append(html);
        }
    });
    $(".edit").live("click", function() {
        $(this).css("display", "none").prevAll(".place_name").css("display", "none").prevAll(".inputfield_td").css("display", "block").nextAll(".cancel").css("display", "block").nextAll(".save").css("display", "block").prevAll(".inputfield_td").css("display", "block");
    });
    $(".cancel").live("click", function() {
        $(this).css("display", "none").prevAll(".edit").css("display", "block").prevAll(".place_name").css("display", "block").prevAll(".inputfield_td").css("display", "none").nextAll(".save").css("display", "none");
    });
    $(".save").live("click", function() {
        var myvariable1 = $(this).siblings().find("input[type=text]").val();
        var myvariable2 = $(this).prevAll("td:last").attr("id");
        $(this).css("display", "none").prevAll(".cancel").css("display", "none").prevAll(".edit").css("display", "block").prevAll(".place_name").css("display", "block").prevAll(".inputfield_td").css("display", "none");
        alert("save name: " + myvariable1 + " save id: " + myvariable2);
    });
    $(".delete").live("click", function() {
        var myvariable3 = $(this).prevAll("td:last").attr("id");
        alert(myvariable3);
    });
    $(".new").live("click", function() {
        var myvariable4 = $(this).prevAll("input[type=text]").val();
        $.post("place/place_list.php", {
            action: "new",
            name: "" + myvariable4 + ""
        });
    });
});
4

3 回答 3

2

将所有事件处理程序放在 ajax 函数之外,并改用该live()方法。并且您需要包含使用 ajax 时要发送的数据。来自visualjquery

$(function() {
    $.ajax({
        type: "POST",
        url: "some.php",
        data: "name=John&location=Boston",
        success: function(msg){
            alert( "Data Saved: " + msg );
        }
    });

    $(".edit").live("click", function() {
        //event handler code here
    });
    //more event handlers
});
于 2009-07-08T07:49:46.023 回答
2

我认为在将来自 php 的新行附加到 div 之后,您没有收到用于编辑、删除等的点击事件。

尝试使用 jquery live 插件在创建新内容时绑定点击事件。请参阅处理类似问题的这个问题。

于 2009-07-08T07:50:15.537 回答
1

就像peirixTheVillageIdiot指出的那样,实时插件可能有用。但是,您的代码中可能还有其他一些错误:

首先,您的 HTML 无效。您必须在属性值周围加上引号。您可以通过使用反斜杠转义内部引号来在引号内执行此操作:

echo "<input type=\"text\" class=\"inputfield_visible\" />";

因为这看起来不太好,如果你改变它,你可以离开 PHP 部分并编写纯 HTML:

<?php
    ...
    echo "</tbody>";
    echo "</table>";
    echo "<input type=text class=inputfield_visible />";
    echo "<button class=new>Neu</button>";
?>

对此(恕我直言,更具可读性):

<?php
    ...
?>

</tbody>
</table>
<input type="text" class="inputfield_visible" />
<button class="new">Neu</button>

其次,这似乎更重要,在我看来你有一个 SQLInjection 漏洞,因为你直接将字段值传递给 mysql 而不首先使用mysql_real_escape_string。我不是那么喜欢 PHP,所以也许我弄错了,但是如果您输入';--输入字段会发生什么?

于 2009-07-08T08:45:09.983 回答