/Javascript/jQuery/How to add ajax loading icon in jquery

How to add ajax loading icon in jquery

jQuery.fn.ajax = function(options)
{
    var $this = $(this);
    debugger;
    function invokeFunc(func, arguments)
    {
        if ( typeof(func) == "function")
        {
            func( arguments ) ;
        }
    }

    function _think( obj, think )
    {
        if ( think )
        {
            obj.html('<div class="loading" style="background: url(/public/images/loading_1.gif) no-repeat; display:inline-block; width:70px; height:30px; padding-left:25px;"> Loading ... </div>');
        }
        else
        {
            obj.find(".loading").hide();
        }
    }

    function makeMeThink( think )
    {
        if ( $this.is(".ajax-loading") )
        {
            _think($this,think);
        }
        else
        {
            _think($this, think);
        }
    }

    options = $.extend({}, options); // make options not null - ridiculous, but still.
    // read more about ajax events
    var newoptions = $.extend({
        beforeSend: function()
        {
            invokeFunc(options.beforeSend, null);
            makeMeThink(true);
        },

        complete: function()
        {
            invokeFunc(options.complete);
            makeMeThink(false);
        },
        success:function(result)
        {
            invokeFunc(options.success);
            if ( options.load )
            {
                $this.html(result);
            }
        }

    }, options);

    $.ajax(newoptions);
};

Source: stackoverflow.com

Similar codes

0 vote312 views1 answer
Promise.all jquery ajax
Javascript jQuery
0 vote401 views1 answer
Jquery rotate
Javascript jQuery
2 votes362 views2 answers
How to put html inside jquery text
Javascript jQuery
0 vote365 views1 answer
Use jquery in jsbench me
Javascript jQuery
0 vote321 views1 answer
Jquery id value input
Javascript jQuery
0 vote367 views1 answer
Jquery how to detect click outside off-canvas-navigation
Javascript jQuery
4 votes357 views1 answer
Can we import jquery library from developer tools
Javascript jQuery
0 vote342 views1 answer
Jquery datatable get column values in array
Javascript jQuery
20 votes378 views5 answers
Get text selected option jquery
Javascript jQuery
19 votes388 views4 answers
Get element by name in jquery
Javascript jQuery