0

私はしばらくの間、jQuery Ajax-Request で苦労しています。ステップバイステップの評価フォームを作成しています。実際には、各ステップで送信されるフォームは 1 つだけです (現在のステップは PHP に送信され、そのステップにとって重要なデータのみが検証されます)。

問題：

Ajax 呼び出しは、ページをリロードせずに何度も送信されています。ajax 呼び出し (Firebug コンソールにログイン) は正しい値 (PHP 検証が失敗した場合のエラーなど) を返しますが、jQuery は依然として古い戻り値 (古いエラーや成功など) を最初に取得し、コードをもう一度調べます..

コード

これが私のjQuery関数です..

    $(ajax_cont).find(':submit').live('mouseup keyup',function(){

        submitButton  = $(this);

    });

    $(ajax_cont).live("submit", function(d) {

        var index = submitButton.attr("id").substring(9);

        d.preventDefault();

        var str = $(this).serialize() + "&step=" + index;
        var uri = ajax_default;

        $.ajax({

            type: "POST",
            cache: false,
            asynch: false,
            url: uri,
            data: str,
            success: function(data) {

                $(".step_slider_container").ajaxComplete(function(event, request, settings) {

                    if(data.success) {

                        alert("jaa");

                        var next_step = "";

                        $(ajax_cont).parent().find(".error").html("").hide();
                        $(ajax_cont).find(".error_input").removeClass("error_input");

                        next_step = data.next;

                        console.log(data.next);

                        step_check = $(ajax_cont).find(".step_check").val();

                        if(step_check.indexOf(next_step) == -1) {

                            step_check = step_check + "," + next_step;

                        }

                        $(ajax_cont).find(".step_check").val(step_check);

                        var enabled_array = step_check.split(',');

                        $.each(enabled_array, function(enabled_index, enabled_value) {

                            if(enabled_array[enabled_index].length > 0) {

                                tmp_div = enabled_array[enabled_index];

                                $("body").find(".step_" + tmp_div).removeClass("disabled");

                            }

                        });

                        // Show - Hide Container

                        var id = "#step_" + next_step;

                        fadeDiv(id);

                        if(next_step == 3) {

                            preview_rating();
                            setHeight(ajax_cont.height());

                        }

                        // Navigation

                        $("body").find(".step").removeClass("step_active");
                        $("body").find(".step_" + next_step).addClass("step_active");

                    }

                    if(data.error) {

                        next_step = "";

                        $(ajax_cont).find(".error_input").removeClass("error_input");

                        error       =   data.error;
                        error_ids   =   data.error_id;

                        $.each(error_ids, function(index, value) {

                            id = "#" + error_ids[index];

                            $(id).addClass("error_input");

                        });

                        $(ajax_cont).parent().find(".error").html("<p>" + error + "</p>").show();

                        setHeight(ajax_cont.height());

                    }

                });

            },
            dataType: "json"

        });

        return false;

    });

誰かが問題の答えを見つけてくれることを願っています..私を夢中にさせているようです:(

4

2 に答える 2

0

あなたのコードにはいくつかの問題があります。

a) ajax 呼び出しの成功イベント内で ajaxSuccess イベントを設定しています... b) data.successPHP エラーのために変更されない、成功したかどうかを判断するために使用しています。

代わりに、次のことを行う必要があります。

$(ajax_cont).find(':submit').live('mouseup keyup',function(){

    submitButton  = $(this);

});

$(ajax_cont).live("submit", function(d) {

    var index = submitButton.attr("id").substring(9);

    d.preventDefault();

    var str = $(this).serialize() + "&step=" + index;
    var uri = ajax_default;

    $.ajax({

        type: "POST",
        cache: false,
        asynch: false,
        url: uri,
        data: str,
        success: function(data) {

            if(data.success) {

                alert("jaa");

                var next_step = "";

                $(ajax_cont).parent().find(".error").html("").hide();
                $(ajax_cont).find(".error_input").removeClass("error_input");

                next_step = data.next;

                console.log(data.next);

                step_check = $(ajax_cont).find(".step_check").val();

                if(step_check.indexOf(next_step) == -1) {

                    step_check = step_check + "," + next_step;

                }

                $(ajax_cont).find(".step_check").val(step_check);

                var enabled_array = step_check.split(',');

                $.each(enabled_array, function(enabled_index, enabled_value) {

                    if(enabled_array[enabled_index].length > 0) {

                        tmp_div = enabled_array[enabled_index];

                        $("body").find(".step_" + tmp_div).removeClass("disabled");

                    }

                });

                // Show - Hide Container

                var id = "#step_" + next_step;

                fadeDiv(id);

                if(next_step == 3) {

                    preview_rating();
                    setHeight(ajax_cont.height());

                }

                // Navigation

                $("body").find(".step").removeClass("step_active");
                $("body").find(".step_" + next_step).addClass("step_active");

            }

            if(data.error) {

                next_step = "";

                $(ajax_cont).find(".error_input").removeClass("error_input");

                error       =   data.error;
                error_ids   =   data.error_id;

                $.each(error_ids, function(index, value) {

                    id = "#" + error_ids[index];

                    $(id).addClass("error_input");

                });

                $(ajax_cont).parent().find(".error").html("<p>" + error + "</p>").show();

                setHeight(ajax_cont.height());

            }

        },
        error : function()
        {
            alert('there was an error parsing the json, or processing your request');
        },
        dataType: "json"

    });

    return false;

});

イベントを削除し、ajax リクエストにイベントajaxSuccessを実装したことに注意してください。error

于 2012-05-30T10:13:26.210 に答える
0

@thecodeparadox - コードの壁に同意します。コードが多すぎるのは、コードが少なすぎるのと同じくらい悪いです:-)

複数の AJAX 送信があり、古い要求からの応答を使用しているように聞こえます。Ajax Manager http://www.protofunc.com/scripts/jquery/ajaxManager/のようなものを使用してみてください。これにより、リクエストをキューに入れたりキャンセルしたりできます。

于 2012-05-30T10:07:13.870 に答える