动态添加数据到属性/选项

Question

我不确定“属性”或“选项”是正确的术语，但这是我需要弄清楚的。

假设有以下情况：

' $.fileup({
            url: '/file/upload',
            inputID: 'upload-6',
            queueID: 'upload-6-queue',
            files: [
                {
                    id: 1,
                    name: 'Cat.jpg', // required
                    size: '254361',  // required
                    previewUrl: 'img/preview/cat.jpg',
                    downloadUrl: 'img/cat.jpg',
                    customParam: '123'
                },
                {
                    id: 2,
                    name: 'Flower.jpg', // required
                    size: '924160',     // required
                    previewUrl: 'img/preview/flower.jpg',
                    downloadUrl: 'img/flower.jpg',
                    customParam: '456'
                },
                {
                    name: 'FileUp.zip', // required
                    size: '23040',      // required
                    downloadUrl: 'https://github.com/shabuninil/fileup/archive/master.zip'
                }
            ]
        }); '

由于数据库和文件列表的交互需要PHP，我如何通过ajax调用将所需的信息添加到'files:‘。我知道如何做PHP端，但没有任何线索，如何填充“文件”属性。我可以添加'file: function(php data return)'，但这不会填充其余的属性(name，size...)。

谢谢,

戴夫

这是一个更新，希望能得到回复。我尝试了几种方法，并接近了，但仍然不能正常工作。下面是我现在拥有的代码：

 $.fileup({
           url: 'UpIt.php',
            inputID: 'upload-2',
            dropzoneID: 'upload-2-dropzone',
            queueID: 'upload-2-queue',
            lang: 'en',
            onSelect: function(file) {
                $('#multiple button').show();
            },
            onRemove: function(file, total, file_number) {
                alert(file_number);
                if (file === '*' || total === 1) {
                    $('#multiple button').hide();
                }
            },
            onSuccess: function(response, file_number, file) {
                
                Snarl.addNotification({
                    title: 'Upload success',
                    text: file.name,
                    icon: '<i class="fa fa-check"></i>'
                });
            },
            onError: function(event, file, file_number) {
               
                Snarl.addNotification({
                    title: 'Upload error',
                    text: file.name,
                    icon: '<i class="fa fa-times"></i>'
                });
            },
         files: LoadFiles()
         
        });
        
        function LoadFiles()
        {
             $.ajax({
                url: 'LoadFiles.php',
                type: "POST",
                dataType: 'json',
               
                success: function (FileData) {

                    return FileData;
                },
        error: function (xhr, ajaxOptions, thrownError) {
            alert(xhr.status);
            alert(thrownError);
        }
            });
        }       

首先做的是创建一个变量，并对数组进行硬编码，然后在"file“属性中使用它，效果非常好。但是，如果我将变量赋值给LoadFiles函数，它将不会坚持，由于某种原因，脚本运行两次(可能我需要使用ready)，因此该变量被销毁，并成为未声明的。因此，我的下一种方法是使用上面的方法，让属性"file“直接从函数调用中赋值，但仍然不起作用。我甚至将Ajax调用放在了属性中，并将其声明为一个函数"file: function() {ajax stuff}，但这破坏了整个脚本。

我遗漏了什么？

谢谢,

戴夫

Answer 1

如果进行ajax调用，您不会立即获得响应，因此您的LoadFiles函数不需要返回值。

您需要做的是扭转流程，即在响应到达时让ajax调用$.fileup，而不是让$.fileup在LoadFiles中调用ajax：

//this function will initialize the fileup, when it is called with the list of files later
function initFileup(fileData) {
    $.fileup({
        url: 'UpIt.php',
        inputID: 'upload-2',
        dropzoneID: 'upload-2-dropzone',
        queueID: 'upload-2-queue',
        lang: 'en',
        onSelect: function (file) {
            $('#multiple button').show();
        },
        onRemove: function (file, total, file_number) {
            alert(file_number);
            if (file === '*' || total === 1) {
                $('#multiple button').hide();
            }
        },
        onSuccess: function (response, file_number, file) {

            Snarl.addNotification({
                title: 'Upload success',
                text: file.name,
                icon: '<i class="fa fa-check"></i>'
            });
        },
        onError: function (event, file, file_number) {

            Snarl.addNotification({
                title: 'Upload error',
                text: file.name,
                icon: '<i class="fa fa-times"></i>'
            });
        },
        files: fileData
    });
}

//this ajax call is started immediatelly and upon receiving the response data
//it will call the function initFileup to initialize the fileup
$.ajax({
    url: 'LoadFiles.php',
    type: "POST",
    dataType: 'json',

    success: function (fileData) {
        initFileup(fileData);
    },
    error: function (xhr, ajaxOptions, thrownError) {
        alert(xhr.status);
        alert(thrownError);
    }
});