Search code examples
javascriptjqueryjquery-file-uploadblueimp

Global variable value in function doesn't update

I'm using the the jQuery fileupload plugin and configure it like this:

jQuery(document).ready(function() {
  jQuery("#fileupload").fileupload({
    dataType: "json",
    url: "ajax_handler.php?globalVar=" + globalVar,
    send: function (e, data) {

    },
    done: function (e, data) {

    }
});

....

Where globalVar is (wait for it) a global variable.

The problem is that if I change the value of globalVar and then do a file upload (using the jQuery file upload plugin which is AJAX so that the page doesn't change), the URL that the request is made to has the original globalVar value (that it had when the page first loaded).

Why is this happening?

Solution

  • When you create the file upload widget, you're passing it a configuration object. This object has a number of properties, among them url.

    The property values are evaluated when the object is created (in your case when you create the file upload widget in $(document).ready()). The object has no knowledge of the globalVar variable since the value that is assigned:

    "ajax_handler.php?globalVar=" + globalVar

    evaluates to a simple string (you're not passing it a reference to globalVar or anything like that). The behavior you seem to be expecting could only happen if you'd assign a function to the url property in which you reference globalVar (I don't know whether the file upload plugin supports this).

    So even if you change globalVar at a later time, the file upload widget's url configuration option will stay the same. If you want to change it, you need to explicitly assign it again.