Valums fileuploader с несколькими экземплярами - PullRequest
2 голосов
/ 16 февраля 2012

Я использую несколько экземпляров с valums fileuploader , но кажется, что загрузчик использует только последние настройки для каждого экземпляра, есть ли возможность избежать этого и использовать локальные настройки? На правильном экземпляре загрузка идет нормально, но элемент в initializeUploader всегда одинаков, независимо от того, какой экземпляр я использую.

jQuery(function() {
    $("[rel='uploadable']").each(function(){
        initializeUploader($(this).attr("id"))
    })
});
function initializeUploader(anchor) {
    element = document.getElementById(anchor)
    uploader = new qq.FileUploader({
        element: element,
        action: element.getAttribute("data-upload-path"),
        allowedExtensions: ["png", "gif", "jpg", "jpeg"],
        params: {
            authenticity_token: $("meta[name=csrf-token]").attr("content")
        },
        onSubmit: function(id, fileName){
            console.log ($(element))
            $(element).append("<span class='image'><div id='progress-" + id + "'></div></span>")
        },
        onProgress: function(id, fileName, loaded, total){
            var progress = (loaded / total) * 100;
            $("#progress-" + id).progressbar({value: progress})
        },
        onComplete: function(id, fileName, responseJSON){
            image_url = ""
            $.each(responseJSON, function(key, item) {
                if (key == "url")
                    image_url = item
            });

            $("#progress-" + id).remove();
            console.log($(element).parent())
            console.log($(element).closest(".quanta"))
            console.log(image_url)
            $(element).closest(".quanta").css({'width': '300px', 'height': '300px', 'background-color': '', 'background-image': 'url(' + image_url + ')', 'background-size': '100% 100%'})
        },
        debug: true
    });
};

Ответы [ 2 ]

2 голосов
/ 08 марта 2012

В initializeUploader переменные element и uploader являются глобальными.Поэтому, когда такие вещи, как

    ...
    onSubmit: function(id, fileName){
        console.log ($(element))
        $(element).append("<span class='image'><div id='progress-" + id + "'></div></span>")
    },
    ...

, будут вызваны, при последнем значении, установленном на elementиспользуйте "var", чтобы локальная переменная была захвачена и использована.

2 голосов
/ 08 марта 2012

Я столкнулся с той же проблемой.Чтобы решить мою проблему, я использовал этот трюк.

       $('a[href="#tabpdf"]').livequery('click', function () {
          initializeUploader($('#pdfuploader')[0]);  
      });
      $('a[href="#tabphotos"]').livequery('click', function () {
          initializeUploader($('#photouploader')[0]);  
      });   

Я использую условные операторы для загрузки функции и передал ей специальный параметр.Надеюсь, это поможет.

...