Применение Uploadify к новым элементам DOM - PullRequest
Новая
       7

Применение Uploadify к новым элементам DOM

1 голос
/ 05 февраля 2012

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

$(document).ready(function(){
   $(".video_upload").each(function(){
       var t = $(this);
       var f = $("#"+i).siblings(".show_file");
       f.hide();
       setupUpload(t,f);
   });
});
function setupUpload(t,f){
    t.uploadify({
        'uploader'      : '<?=site_url('../assets/js/uploadify/uploadify.swf');?>',
        'script'        : '<?=site_url('utility/send_vid');?>',
        'cancelImg'     : '<?=site_url('../assets/js/uploadify/cancel.png');?>',
        'folder'        : '/uploads/',
        'auto'          : true,
        'onComplete'    : function(event, ID, fileObj, response, data) {
            var r = $.parseJSON(response);
            if(r.error){
                $("#"+i).siblings(".error").html(r.reason).show();
            }else{
                $("#"+i).siblings("#video_href").val(r.src);
                setTimeout(function(){
                    f.children('.file_name').text(r.nice_name);
                    f.show();
                },1000);
            }
        }
    });
}

Все это прекрасно работает.Теперь я хочу вставить новый элемент ввода файла на страницу, когда пользователь нажимает определенную кнопку.Поэтому они нажимают кнопку, вставляют новый элемент ввода файла, который необходимо загрузить с помощью Uploadify и преобразовать, как и другие элементы ввода.

После вставки нового элемента я пытаюсь вызвать функцию setupUpload(),но это не работаетБудет ли функция такого рода работать только при загрузке страницы или ее можно вызывать каждый раз?

РЕДАКТИРОВАТЬ:

В настоящее время я вызываю функцию setupUpload () со следующими параметрами: 

    var t = $("#ind_video_2");
    var f = t.siblings(".show_file");
    setupUpload(t,f);

Идентификаторэто идентификатор нового элемента, но я просто использую его как временный селектор, пока не узнаю, что все работает, и буду использовать что-то более динамичное ...

1 Ответ

0 голосов
/ 05 февраля 2012

Чтобы это работало, вам нужно обернуть все в одну функцию, которая вызывается при загрузке страницы и всякий раз, когда вам это нужно в будущем.Итак, что-то вроде: 

function setupUpload(){
    $(".video_upload").each(function(){
        var t = $(this);
        if(t.siblings('.uploadifyQueue').length==0){
            var f = t.siblings(".show_file");
            t.uploadify({
                'uploader'      : '<?=site_url('../assets/js/uploadify/uploadify.swf');?>',
                'script'        : '<?=site_url('utility/send_vid');?>',
                'cancelImg'     : '<?=site_url('../assets/js/uploadify/cancel.png');?>',
                'folder'        : '/uploads/',
                'auto'          : true,
                'onComplete'    : function(event, ID, fileObj, response, data) {
                    var r = $.parseJSON(response);
                    if(r.error){
                        t.siblings(".error").html(r.reason).show();
                    }else{
                        t.siblings("#video_href").val(r.src);
                        setTimeout(function(){
                            f.children('.file_name').text(r.nice_name);
                            f.show();
                        },1000);
                    }
                }
            });
        }
    });
}

Все, что вам нужно сделать, это вызвать его, когда jQuery готов или когда пользователь нажимает кнопку для вставки новых элементов DOM.

...