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

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'
                }
            ]
        }); '

如何在Ajax调用中添加所需的“files:”信息，由于需要使用PHP与数据库和文件列表交互。我知道如何在PHP端处理，但不知道如何填写“file”属性。我可以添加“file：function（php数据返回）”，但这将不会填充其余属性（名称，大小...）。

谢谢,

戴夫

这是最新更新，希望能得到回复。我已经尝试了几种方法，并且接近成功，但仍然没有正确地工作。这是我现在拥有的代码：

 $.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);
        }
            });
        }       

首先，我创建了一个变量，并硬编码了数组，然后在“文件”属性中使用它，这非常有效。但是，如果我将变量分配给LoadFiles函数，由于某种原因脚本运行两次（也许需要使用ready），所以变量被销毁并变成未声明状态。所以我的下一步是通过以上方法，从函数调用中直接分配“file”属性，但仍然无法正常工作。我甚至将Ajax调用放在属性中，并声明为函数“file：function（）{ajax stuff}”，但这破坏了整个脚本。

我错过了什么？

谢谢， Dave

- MaxThrust

Answer 1

如果您进行ajax调用，则无法立即获得响应，因此您没有一个值可以从LoadFiles函数返回。

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

//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);
    }
});

- mcernak