此特定实例中的javascript变量范围

Question

In javascript/jQuery, before a file upload plugin is called, a variable is set:

doc_type = "q";

Then, the plugin is initialized. Within the plugin options is: onSelect: , which is called when files are selected. Code looks like this:

var doc_type = "q";
$(function(){
    var project_num = $("#pnum").val();
    var uploadObj = $("#fileuploader").uploadFile({
        url: "upload_files_processor.php",
        method: "POST",
        onSelect: function(){
            doc_type = "W";
            //Or:
            //doc_type = $('#hidden_input').val();  <-- What I really need to do
            return true;
        },
            allowedTypes:"pdf,doc,docx,xls,xlsx,ppt,pptx,bmp,jpg,png,zip",
        fileName: "myfile",
        formData: {"project_num":project_num,"doc_type":doc_type},
        multiple: true,
        autoSubmit: true,
        showStatusAfterSuccess:false,
        onSuccess:function(files,data,xhr) {
            //Refresh documents table
        },
    });
}); //END document.ready()

Problem:

In the upload processor upload_files_processor.php , the received doc_type value is:

$doc_type = $_POST["doc_type"];  // q

How can I receive the value W ?

References: heyageek jquery upload file plugin website -- click on API & Options tab

Answer 1

If you look at the Advanced tab of the api. There is an option called dynamicFormData which is executed and appears to be appended to the formdata right before sending.

dynamicFormData: function() {
    var data ={"doc_type":doc_type };
    return data;
},

This is what you need because doc_type will be evaluated right before it is sent rather than when it is created.

IF this works. I don't really have a way to test it

Answer 2

Perhaps you can do it this way:

var formData = {
    project_num: null,
    doc_type: "q"
};

$(function() {

    formData.project_num = $("#pnum").val();

    var uploadObj = $("#fileuploader").uploadFile({
        url: "upload_files_processor.php",
        method: "POST",
        onSelect: function(){
            formData.doc_type = $('#hidden_input').val();
        },
        allowedTypes:"pdf,doc,docx,xls,xlsx,ppt,pptx,bmp,jpg,png,zip",
        fileName: "myfile",
        formData: formData,
        multiple: true,
        autoSubmit: true,
        showStatusAfterSuccess:false,
        onSuccess:function(files,data,xhr) {
            //Refresh documents table
        },
    });
});

I am not sure how the plugin works internally. If it serializes formData into some internal format, you could run into problems. However if it is simply setting the internal formData attribute to point to a provided object, then this should work. The reference to formData remains the same; you're just modifying a property of the object that is used.

Answer 3

In your code, instead of formData: {"project_num":project_num,"doc_type":doc_type}, use this:

dynamicFormData: function()
{
    return {
        project_num: $("#pnum").val(),
        doc_type: $('#hidden_input').val()
    };
},

And remove the lines var doc_type = "q"; and var project_num = $("#pnum").val()