/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

10 votes221 views6 answers
Post jquery
Javascript jQuery
2 votes245 views2 answers
Select class with data attribute jquery
Javascript jQuery
19 votes214 views2 answers
Jquery modal on show + target button
Javascript jQuery
0 vote213 views1 answer
Show and hide div tag based on checkbox selection using jquery
Javascript jQuery
0 vote216 views1 answer
Jquery validate required false with additional function
Javascript jQuery
0 vote263 views2 answers
Jquery add submit button dynamically to form
Javascript jQuery
0 vote222 views1 answer
Ocultar div con jquery
Javascript jQuery
0 vote201 views1 answer
Uncaught ReferenceError: jQuery is not defined at (index): "405"
Javascript jQuery
0 vote217 views1 answer
Jquery match height,jquery matchheight
Javascript jQuery
12 votes217 views2 answers
Call a function on load jquery
Javascript jQuery