1

標題の件を達成しようと、インターネット上の記事を参考に挑戦中ですが、自身の未熟さから理解に苦しみ中々進展をえることができません。毎度のことで大変申し訳ありませんが、どなたかご教示をお願いできませんでしょうか?

質問

Ajaxの動作完了を$.Deferred()というものの利用で認識できる記事をお見かしますが、Ajax利用の関数側がConsole.logで文字を表示するだけの紹介が多い気がします...
Ajax利用でデータ取得した結果を当該関数の戻り値として返したいのですが、こちらの完了検知と併せて戻り値を取得するには如何したらよろしいのでしょうか?現況関数の呼び出し側に戻り値が得られていないように受けて取れます。(開発ツールでみる限りAjax自体は機能しており応答を返している様子だが)

達成したいことのイメージ

画面で指定された日付が、AJAXで参照するDB側のカレンダで稼働日か否か、はたまた参照に失敗したかというエラー検知を行おうとしています。

見よう見まねでコーディングしたのが現況です。誤った部分をご指摘頂けますと幸いです。

//errnoが戻ってくれば、DBを参照できなかったか当該日が稼働日ではなかった、ということ。 
    var deferred = sdateCheck();
    if (deferred.done(function(){}) != "") {
        errhandler($(this), false, "err#014");
        errhandler($(this), false, "err#015");
    } else {
        errhandler($(this), true, errno);
    };


function sdateCheck () {
        var deferred = new $.Deferred();

        var arr_ymd = $("#calendar").val().split("/");
        var yyyymmdd = arr_ymd[0] + arr_ymd[1] + arr_ymd[2];
        var errno = "";
        $.ajax({
            url: "sdatecheck.php",
            type: "POST",
            dataType: "json",
            data: {
                maker_no: yyyymmdd,
            }
        })
        .done(function(data){
            //sdatecheck.phpからのSELECT結果1項目が戻る。「0」は稼働日
            if (data[0] != 0) {
                errno = "err#014";
            }
        })
        .fail(function(){
            console.log("失敗");
            errno = "err#015";
        })
        .always(function(){           //みようみまね
            deferred.resolve();  //みようみまね
        });                          //みようみまね
        return deferred;             //みようみまね
        return errno;                //勘
    }
1
  • //勘 は如何なものかと思いますが、3例回答しておきます。
    – yyz
    Commented 2017年11月3日 18:59

1 件の回答 1

2

画面で指定された日付が、AJAXで参照するDB側のカレンダで稼働日か否か、はたまた参照に失敗したかというエラー検知を行おうとしています。 

Deferredを使った、$.ajax接続判定例(”参照に失敗した”=”接続エラー”として回答しました。)
jQuery.Deferredの詳しい解説は、https://techblog.yahoo.co.jp/programming/jquery-deferred/ を見てください。
 

$(function(){
        var d = proc_a();
        d.done(function(data, textStatus){
            //ok
            console.log("ok:"+textStatus);
            console.log(data);
        });
        d.fail(function(data, textStatus){
            //error
            console.log("error:"+textStatus);
            console.log(data);
        });

    function proc_a(){
        var dp_a = new $.Deferred();

        $.ajax({
                type: "GET",
                url:  "test.php",
                data: "hoge=piyo"
        }).done(function(data, textStatus, jqXHR){
            //done
            dp_a.resolve(data, textStatus, jqXHR);

        }).fail(function(data, textStatus, jqXHR){
            //fail
            dp_a.reject("error", textStatus, jqXHR);

        }).always(function(data, textStatus, jqXHR){
            //done、fail どちらでも処理を行うとき
        });

        return dp_a;
    }
});

また、DBに起因するエラーもfailとするなら以下の様にreject,resolveを呼び出すと良いでしょう。

if (data[0] != 0) {
    errno = "err#014";
    dp_a.reject(errno, textStatus, jqXHR);//fail
}else{
    dp_a.resolve(data, textStatus, jqXHR);//done
}

接続エラーの判定だけなら $.ajaxは内部でDeferred(Promiseを使っているかも)を使っているので以下の様にも書けます。

  $(function(){
        $.ajax({
                type: "GET",
                url:  "test.php",
                data: "hoge=piyo"
            }).done(function(data, textStatus, jqXHR){
                //ok
            console.log("ok:"+jqXHR.status);
            console.log(data);
            }).fail(function(data, textStatus, jqXHR){
                //error
            console.log("error:"+jqXHR);
            });
   });

以前の$.ajaxコールバック(jQuery1.7以降では非推奨 success:、error:)例です。

$(function(){
        var d = proc_a();
        d.done(function(data, textStatus){
            //ok
            console.log("ok:"+textStatus);
            console.log(data);
        });
        d.fail(function(data, textStatus){
            //error
            console.log("error:"+textStatus);
            console.log(data);
        });

    function proc_a(){
        var dp_a = new $.Deferred();

        $.ajax({
                type: "GET",
                url:  "test.php",
                data: "hoge=piyo",
            success:function(data, textStatus, jqXHR){
                //done
                dp_a.resolve(data, textStatus, jqXHR);
            },
            error:function(data, textStatus, jqXHR){
                //fail
                dp_a.reject("error", textStatus, jqXHR);
            }
        });
        return dp_a;
    }
});
1
  • yyz様 いつもご親切なご説明をありがとうございます。理解できました。ネット上の記事や文献を、自分の達成したいことにどう当てはめるべきかいつも困ってしまうので本当に助かります。
    – saya24
    Commented 2017年11月4日 3:58

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。