3

さて、私はほとんどすべてを試しました。

$.post("include/ajax.php", { type: "workbookNumber", wbn: $("input[name='wbn']").val() }, function(data) {
    error.push("<li>"+data+"</li>");
    alert(data);
});

error.pushは作成されたエラー配列であり、完全に機能しますが、配列にはまったく追加されません。そのコード行が存在しないかのようです。コンマ変数データに余分なコンマがあり、そこにあることを示している場合がありますが、<li></li>それでも、は表示されるはずです。

jQuery.ajax({
    type: "POST",
    url: "include/ajax.php",
    dataType:"html",
    data: { type: "workbookNumber", wbn: $("input[name='wbn']").val() },
    success:function(response) {
    alert(response);
    },
    error:function (xhr, ajaxOptions, thrownError) {
        alert("damn. -_-");
        alert(xhr.status);
        alert(thrownError);
    }    
});

これについての合理的な説明は考えられません。PHPは20000を超えるコードのデータベースを検索しているため、結果を表示するのに十分な時間がないと思っていましたが、結果はアラートから返されます。画面に表示できる実際のテキストのエラー配列を介してではありません。

エラー配列は正常に機能します。機能しないのはこの関数だけです。正しく機能する他の例を次に示します。

if($("input[name='fname']").val() == "") {
    error.push("<li>The first name field is blank</li>");
}
if($("input[name='lname']").val() == "") {
    error.push("<li>The last name field is blank</li>");
}

if($("select[name='usertype']").val() == 0) {
    if($("input[name='vcode']").val() == "") {
        error.push("<li>The voucher code field is blank</li>");
    } else {
        $.post("include/ajax.php", { type: "findVoucher", vcode: $("input[name='vcode']").val() }, function(data) {
            if(data == "none") {
                error.push("<li>The voucher code does not exist</li>");
            }
        });
    }
}

コード全体は次のとおりです。

$(document).ready(function() {
$("#sit_date").datepicker();
$("select[name='usertype']").change(function() {
    if($(this).val()=="0") {
        $(".indv").slideUp(500);
        $(".comp").slideDown(500);
    } else {
        $(".indv").slideDown(500);
        $(".comp").slideUp(500);
    }
});
$("input[name='marka'],input[name='markb']").bind("keypress paste keyup  blur focus", function() {
    var marka = $("input[name='marka']").val();
    var markb = $("input[name='markb']").val();
    var perc = (marka/markb)*100;
    if(perc>0 && perc<=100) {
        $("#per").html(Math.round(perc));
    } else {
        $("#per").html("");
    }
});
$("input[name='vcode']").bind("keypress keyup paste blur focus", function() {
    $.post("include/ajax.php", { type: "checkVoucher", vcode: $(this).val() }, function(data) {
        $("input[name='group']").val(data);
    });
    $.post("include/ajax.php", { type: "checkType", vcode: $(this).val() }, function(data) {
        $("input[name='certificates']").val(data);
    });
});

$("input[name='wbn']").bind("keypress keyup paste blur focus", function() {
    $.post("include/ajax.php", { type: "getAssessment", wbn: $(this).val() }, function(data) {
        if(data!="") {
            $("select[name='assessment']").html(data);
        }
    });
});

/*
//turn into function
$(document).keyup(function(event){
    if(event.keyCode == 13){
        alert("works");
        $("input[name='manual_add']").click();
    }
});
*/

var error = [];
$("input[name='manual_add']").click(function() {
    if($("input[name='fname']").val() == "") {
        error.push("<li>The first name field is blank</li>");
    }
    if($("input[name='lname']").val() == "") {
        error.push("<li>The last name field is blank</li>");
    }

    if($("select[name='usertype']").val() == 0) {
        if($("input[name='vcode']").val() == "") {
            error.push("<li>The voucher code field is blank</li>");
        } else {
            $.post("include/ajax.php", { type: "findVoucher", vcode: $("input[name='vcode']").val() }, function(data) {
                if(data == "none") {
                    error.push("<li>The voucher code does not exist</li>");
                }
            });
        }
    }

    if($("input[name='wbn']").val() == "") {
        error.push("<li>The workbook number field is blank</li>");
    } else {

        $.post("include/ajax.php", { type: "workbookNumber", wbn: $("input[name='wbn']").val() }, function(data) {
            error.push("<li>"+data+"</li>");
            //this is the only thing that works correctly:
            alert(data);
        });

    }

    if(($("input[name='questions']").val() == "") && ($("input[name='marka']").val() != $("input[name='markb']").val())) {
        error.push("<li>The questions wrong field is blank</li>");
    }

    var list = "";
    $.each(error, function(i,val) { 
        list += val;
    }); 

    if(error.length>0) {
        $(".error").slideUp(500);
        $(".jquery-error ul").html("").append(list);
        $(".jquery-error").slideDown(500);
    } else {
        $("form").submit();
    }
});
});
4

3 に答える 3

2

は関数var errorで宣言されてclick()いるため、その関数の外部からはアクセスできません。グローバルに宣言すると、コードが機能するはずです。（グローバル変数を使用したjsfiddleで問題なく動作しましたerror。）

errorエラー処理コードの残りの部分は、変数（click()関数）と同じスコープで定義されているため、正常に機能します。ただし、ajaxリクエストへのコールバックは、関数のコンテキストではなく、コンテキストで実行されwindowます。これは間違いなくスコープの問題です。

もちろん、エラー通知を更新するには、サーバーからの応答が返ってくるのを待つ必要があります。配列を反復処理して対応する通知を表示する関数を記述し、AJAX呼び出しのerror関数からその関数を呼び出します。error

次のことを試してください。

var error = [];

jQuery.ajax({
    type: "POST",
    url: "include/ajax.php",
    dataType:"html",
    data: { type: "workbookNumber", wbn: $("input[name='wbn']").val() },
    success:function(response) {
        alert(response);
    },
    error:function (xhr, ajaxOptions, thrownError) {
        error.push("<li>"+thrownError+"</li>");
        showErrors();
    }    
});​

function showErrors () {
     var list = "";
    $.each(error, function(i,val) { 
        list += val;
    }); 

    if(error.length>0) {
        $(".error").slideUp(500);
        $(".jquery-error ul").html("").append(list);
        $(".jquery-error").slideDown(500);
    } else {
        $("form").submit();
    }
}
于 2012-05-28T14:11:21.527 に答える
1

次のように、ajax関数が完了するまで待つ必要があります。

} else { //use a variable for ajax
    var XHR = $.post("include/ajax.php", { type: "workbookNumber", wbn: $("input[name='wbn']").val() }, function(data) {
        error.push("<li>"+data+"</li>");
    });

}

XHR.always(function() { //make sure ajax is completed and array updated first
    var list = "";
    $.each(error, function(i,val) { 
        list += val;
    }); 

    if(error.length>0) {
        $(".error").slideUp(500);
        $(".jquery-error ul").html("").append(list);
        $(".jquery-error").slideDown(500);
    } else {
        $("form").submit();
    }
});
于 2012-05-28T14:15:02.370 に答える
1

ローカル変数でグローバル変数エラーを隠していないことを確認してください。使ってみてください

console.log(data);
console.log(error);

匿名関数の内部で、問題がどこにあるかがわかります。

于 2012-05-28T14:36:32.280 に答える