2

私は以下のようなコードを少し持っています:

$(document).on('click', '.set_up_btn', function(){
var menu_name=$('.menu_name').val();
var menu_type=$('.menu_type_sel').val();
var rest_id=$('body').data('rest_id');
var error=false;

if(menu_name=="")
{
    $('.error_box13').eq(0).html("<p>Enter Identifier for this Menu</p>");
    $('.error_box13').eq(0).show(300);
    error=true;
}
if(menu_type=="0")
{
    $('.error_box13').eq(1).html("<p>Select Menu Type</p>");
    $('.error_box13').eq(1).show(300);
    error=true;
}
if(error==true)
{
    return;
}
//check menu name is unique
var data="rest_id="+rest_id+"&name="+menu_name;

$.ajax({
    type:"POST",
    url:"includes/check_menu_name.php",
    data:data,
    success:function(html){
        if(html==1)
        {
            //menu name is duplicate
            $('.error_box13').eq(0).html("<p>Menu Name already in use.</p>");
            $('.error_box13').eq(0).show(300);
            error=true;
        }
        else if(html==2)
        {
            //menu name is ok

        }
    return error;
    }
});//end ajax
if(error==true)
{
    e.stopImmediatePropagation();
    return false;
}

var data2="rest_id="+rest_id+"&name="+menu_name+"&menu_type="+menu_type;

$.ajax({
    type:"POST",
    url:"includes/set_menu.php",
    data:data2,
    success:function(html2){
        if(html2==1)
        {
            var app="";
            if(menu_type==1)
            {
                menu_type="Bar Menu";
            }
            if(menu_type==2)
            {
                menu_type="Food Menu";
            }
            app+="<h2 class='menu_header'>"+menu_type+"</h2><hr />";
            app+="<h2 class='menu_title'>"+menu_name+"</h2>";
            $(app).appendTo($('.third').eq(2));
        }
        else
        {
            alert("ERROR: Could not write to database. Please try again.");
        }
    }
});//end ajax

});

私がする必要があるのは、最初の ajax リクエストが「1」を返す場合、全体的な「クリック」機能を終了することです - メニュー名はこのユーザーに対して既に使用されています。

現在、これが発生した場合、JavaScript は 2 番目の ajax リクエストを実行し続け、データをデータベースに書き込みます。

4

2 に答える 2

1

この問題が発生しているのは、リクエストが戻ったときに成功関数が「後で」呼び出されるためです。瞬時ではないため、エラー変数はまだ入力されていません。成功関数内のエラーを次のように処理します。

$.ajax({
    type:"POST",
    url:"includes/check_menu_name.php",
    data:data,
    success:function(html){
        if(html==1)
        {
            //menu name is duplicate
            $('.error_box13').eq(0).html("<p>Menu Name already in use.</p>");
            $('.error_box13').eq(0).show(300);
            error=true;


            // we must handle the error here!


            handleError(e, error);
        }
        else if(html==2)
        {
            //menu name is ok



            // continue on as normal
            continueNoError();
        }
    return error;
    }
});//end ajax

// Code run here runs BEFORE $.ajax returns


function handleError(e, error) {
    if(error==true)
    {
        e.stopImmediatePropagation();
        return false;
    }
}

function continueNoError() {
    // Put what to after the first ajax call here
}
于 2013-02-26T11:48:22.063 に答える
0

現在、2 番目の AJAX 呼び出しは何が起こっても実行されます。

要件が満たされたときに呼び出すクリック内のメソッドにラップします。

すなわち:

if (menu_type === 2) {
    menu_type="Food Menu";
    setMenu();
}

それから：

var setMenu = function () {
    $.ajax({
        // do stuff
    });
}
于 2013-02-26T11:48:57.310 に答える