버튼 클릭시 로딩 만들어보기...

// font awesome 4.7 필요함

$.fn.Loading = function (text) {

    if (typeof (text) == "undefined" || text == null)

        text = "";

    return this.each(function () {

        var obj = $(this);

        obj.width(obj.width());

        obj.attr("data-origintext", obj.text());

        obj.attr("disabled", true);

        obj.html("<i class='fa fa-spinner fa-spin'></i> " + text);

    });

};

$.fn.Restore = function () {

    return this.each(function () {

        var obj = $(this);

        obj.attr("disabled", false);

        obj.text(obj.attr("data-origintext"));

    });

};

로딩할때 Loading 끝나면 Restore 해주면 됨

사용 예시

$("#btnSearch").click(function () {

var $btn = $(this);

$btn.Loading();

        $.ajax({

            type: "POST",

            url: "Test1",

            dataType: "json",

            data: {

                search: $("#SEARCH").val()

            },

            success: function (data, status, xhr) {

                $btn.Restore();

//기타 작업

            },

            error: function (xhr, ajaxOptions, thrownError) {

                ajaxCommonError(xhr);

$btn.Restore();

            }

        });

    }).trigger("click");

근데 ajax에 자동으로 묶을 수 없을까?