Question

This is partly a jquery question, but most javascript. I just don’t know javascript well enough to understand this code:

1 (function () {
2            $(function () {
3                //Global ajax progress dialog box
4                //Simply run $("#ajax-progress-dialog").dialog("open"); script before the ajax post and
5                //$("#ajax-progress-dialog").dialog("close"); on the ajax post complate
6                $("#ajax-progress-dialog").dialog({
7                    autoOpen: false,
8                    draggable: false,
9                    modal: true,
10                    height: 80,
11                    resizable: false,
12                    title: "Processing, please wait...",
13                    closeOnEscape: false,
14                    open: function () { $(".ui-dialog-titlebar-close").hide(); } // Hide close button
15                });
16            });
17        })(); 

I understand lines 3-15. In fact, I think I understand lines 2 through 16: this is creating an anonymous function and wrapping it as a jquery object, right? Not sure why it needs to be wrapped, but more importantly, I especially don’t understand lines 1: opens with “(function” and 17: closes with “)()”. What’s that about?

BTW, for completeness, note that this is invoked as follows:

$(“#ajax-progress-dialog”).dialog(“open”);

Credit: this example comes from tugberkugurlu

Answer 1

It is a self executing function, basically it keeps everything inside of it out of the global scope. Explained in the thread: What is the purpose of a self executing function in javascript?

But in this example code you shown it is not needed. The document ready call of

$( function(){
    ...
});

does the same exact thing.