Проблемы с jQuery Ajax

Question

Почему следующий не забирает форму? Все, что он делает, это просто делает нормальный пост PHP без каких-либо ошибок ...

Я также использую blockUi, поэтому блокирую / разблокирую.

$(document).ready(function(){
    $("input.update").click(function(){
        var str = $(this).parent().serialize();
        $(this).parent().parent().block({ message: "<span class=\"loading\"><img src=\"<?php echo $siteUrl ?>/admin/template/images/loading.gif\" alt=\"loading...\" /><p>Updating...</p></span>" });
        $.ajax({
            type: "POST",
            url: "forms/update.php",
            data: str,
            success: function(){
                $("div.edit_box").unblock();
                $("div.edit_box").append("<span class=\"success\">This has been updated!</span>");
            }
        });
        return false;
    });
});

Это моя первая попытка использования функциональности jjuery Ajax, поэтому, пожалуйста, потерпите меня.

Answer 1

("input.update").click(function(){

должно быть

$("input.update").click(function(){

Answer 2

Поскольку кажется, что вы используете только коллбэк сообщения «success», вы можете использовать метод .post, который немного проще для глаз. Также вы можете поместить эти вызовы блока в ajaxStart и ajaxStop. Для меня это аккуратнее.

Мне показалось $(this).parent().parent().block неправильным, я изменил его, чтобы ссылаться на тот же элемент, который используется для разблокировки. Я также проверил бы вывод PHP-скрипта, чтобы убедиться, что все, что вы «обновляете», на самом деле обновляется (просто выведите XML из PHP, и вы увидите это в журнале консоли).

$(function() {
    // Apply click handlers to anchors
    $("input.update").click(function(e){
        // Stop normal link click
        e.preventDefault();

        var str = $(this).parent().serialize();

        // Send request
        var action = "forms/update.php";
        $.post(action, {data:str}, function(xml) {
            console.log(xml);
            $("div.edit_box").append("<span class=\"success\">This has been updated!</span>");

        })
    });

    // Adds a wait indicator to any Ajax requests
    $(document.body).ajaxStart(function() {
        $("div.edit_box").block({ message: "<span class=\"loading\"><img src=\"<?php echo $siteUrl ?>/admin/template/images/loading.gif\" alt=\"loading...\" /><p>Updating...</p></span>" });

    }).ajaxStop(function() {
        $("div.edit_box").unblock();
        $("div.edit_box").append("<span class=\"success\">This has been updated!</span>");
    });
});