Как обновить строки в jQuery с помощью PHP и HTML

0

Мой PHP script генерирует таблицу со строками, которая может быть изменена или удалена. Существует также возможность создать новую строку.

Мне сложно определить, как обновлять строки HTML, которые генерируются через PHP и вставляются через jQuery. После обновления он должен быть доступен для редактирования. HTML генерируется в div.

  • jQuery (вставка сгенерированного HTML/ожидание действия)

  • PHP (сгенерировать html)

  • Вернитесь к шагу 1)

(EDIT: исправлено сообщение об ошибке и изменено script)

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 + ""
        });
    });
});
  • 0
    не возражаете, если я спрошу, какие были ошибки в PHP? Просто интересно, так как я не очень хорош в PHP .. (:
Теги:
row

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
});
Поделиться
  • 0
    Каким-то странным образом JS реагирует на события нажатия, но PHP не делает запись в базе данных, когда я хочу создать новую строку. Вы знаете, что я делаю не так?
  • 0
    Задача решена! Скопировал MySQL Query, который сработал, и теперь PHP-скрипт успешно делает запись в базу данных.
2

Я думаю, что вы не получаете события щелчка для редактирования, удаления и т.д. после добавления новых строк из php в div.

Попробуйте использовать jQuery live plugin для привязки событий click, когда и когда создается новый материал. См. этот вопрос, связанный с аналогичной проблемой.

Поделиться
1

Как показано peirix и TheVillageIdiot, возможно, живой плагин может быть полезен. Однако в вашем коде есть некоторые другие вещи:

Во-первых, ваш 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>";
?>

К этому (IMHO гораздо читаем):

<?php
    ...
?>

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

Во-вторых, и это кажется еще более важным, мне кажется, что у вас есть уязвимость SQLInjection, потому что вы передаете значения полей непосредственно в mysql без использования mysql_real_escape_string. Я не в PHP, поэтому, возможно, я ошибся, но что произойдет, если вы введете ';-- в поля ввода?

Поделиться
  • 0
    Спасибо, что помогли мне сделать мой HTML верным! Что касается уязвимости SQLinjection (вы меня там поняли; D), я пытаюсь сначала создать свой веб-сайт, а затем постараюсь исправить эти ошибки :)
  • 0
    видя, что файл php предназначен только для AJAX-вызовов, я думаю, что HTML должен быть «отражен», так как эта информация передается вызывающей стороне?
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню