在init之后使用jquery修改设置UIkit上载

时间:2016-06-12 09:08:04

标签: javascript jquery jquery-file-upload

我正在使用UIkit处理文件上传功能。在网页上,我有多个用户可以发布文件的项目。每个项目都有不同的ID。

我想要的是,对于每个项目,文件都会进入由项目ID命名的文件夹中。但是当初始化UIkit.uploadSelect时,我不能再修改params了。

当我按下一个项目时;在函数上触发onclick事件:GetTaskInfo();

我尝试了很多东西,但仍然没有成功。

感谢任何帮助。

文件上传功能(调用UIkit):

function Upload(id) {
    var progressbar = $("#task_info_progressbar"),
        bar = progressbar.find('.uk-progress-bar'),
        settings = {

            action: '/Scrum/Upload', // upload url

            params: {
                folder: "scrum",
                id: id
            },

            allow: '*.(zip)', // allow only zip files

            filelimit: 1,

            beforeAll: function (files) {

            },
            loadstart: function () {
                bar.css("width", "0%").text("0%");
                progressbar.removeClass("uk-hidden");
            },
            progress: function (percent) {
                percent = Math.ceil(percent);
                bar.css("width", percent + "%").text(percent + "%");
            },
            error: function () {

            },
            abort: function () {

            },
            allcomplete: function (response) {
                bar.css("width", "100%").text("100%");

                setTimeout(function () {
                    progressbar.addClass("uk-hidden");
                }, 250);

            });
            }
        };

    var select = UIkit.uploadSelect($("#task_info_file_select"), settings),
        drop = UIkit.uploadDrop($("#task_info_file_drop"), settings);
}

用户打开项目时的功能。

function GetTaskInfo(id) {
   task_id = $('#task_id');
   Upload(task_id);
}

UIkit上传功能(http://getuikit.com/docs/upload.html

})(function(UI){

"use strict";

UI.component('uploadSelect', {

    init: function() {

        var $this = this;

        this.on("change", function() {
            xhrupload($this.element[0].files, $this.options);
            var twin = $this.element.clone(true).data('uploadSelect', $this);
            $this.element.replaceWith(twin);
            $this.element = twin;
        });
    }
});

UI.component('uploadDrop', {

    defaults: {
        'dragoverClass': 'uk-dragover'
    },

    init: function() {

        var $this = this, hasdragCls = false;

        this.on("drop", function(e){

            if (e.dataTransfer && e.dataTransfer.files) {

                e.stopPropagation();
                e.preventDefault();

                $this.element.removeClass($this.options.dragoverClass);
                $this.element.trigger('dropped.uk.upload', [e.dataTransfer.files]);

                xhrupload(e.dataTransfer.files, $this.options);
            }

        }).on("dragenter", function(e){
            e.stopPropagation();
            e.preventDefault();
        }).on("dragover", function(e){
            e.stopPropagation();
            e.preventDefault();

            if (!hasdragCls) {
                $this.element.addClass($this.options.dragoverClass);
                hasdragCls = true;
            }
        }).on("dragleave", function(e){
            e.stopPropagation();
            e.preventDefault();
            $this.element.removeClass($this.options.dragoverClass);
            hasdragCls = false;
        });
    }
});

1 个答案:

答案 0 :(得分:1)

请参阅文档 https://getuikit.com/docs/upload.html 使用"之前"在提出请求之前修改设置

before: function (settings, files) {
        settings.params.folder = $("#someID").val()
}