Uploadify + jQuery UI

Question

Finora, la mia implementazione uploadify funziona in modo relativamente agevole tranne per un problema fastidioso.

Ho il mio prompt di uploadify in una finestra modale di dialogo jquery-ui. I file vengono caricati correttamente ma per ogni elemento selezionato, vengono visualizzati due elementi identici della coda (stesso ID).

Solo uno di questi elementi di coda viene effettivamente aggiornato con la barra di avanzamento, anche se entrambi sembrano ottenere gli aggiornamenti in percentuale.

Quando il caricamento del file è completo, viene rimosso solo uno di questi elementi della coda (lo stesso aggiornato con la barra di avanzamento).

ho provato al di fuori della finestra di dialogo modale jquery-ui e il doppio comportamento elemento della coda svanì.

Mi piacerebbe mantenere il prompt di uploadify e la coda all'interno di una finestra di dialogo modale, se possibile però.

Eventuali indizi sul motivo per cui l'utilizzo di uploadify in una finestra modale jquery-ui causa questo comportamento di questo elemento di doppia coda?

UPDATE:

$("#Filedata").uploadify({ 
'scriptAccess': 'allways', 
'uploader'  :'<?php echo base_url();?>js/jquery.uploadify-v2.1.4/uploadify.allglyphs.swf', 
'script': '<?php echo site_url();?>/upload/process_upload', 
'cancelImg': '<?php echo base_url();?>js/jquery.uploadify-v2.1.4/cancel.png', 
'folder'   : '/', 
'fileDataName'  :'Filedata', 
'buttonText' : 'Document...', 
'width': '273', 
'height': '51', 
'wmode': 'transparent', 
'auto'   : true, 
'multi'   : false, 
'fileExt' : '*.pdf;', 'fileDesc' :'Document', 
'sizeLimit' : 10485760, 
'simUploadLimit' : 1, 
'queueSizeLimit' :'1', 
'uploaderType' : 'flash', 
'scriptData' : {'userdata':'<?php echo $userdata;?>','upload_token':'<?php echo $token['value'];?>'}, 
    onProgress: function() { 
    //hide upload button 
    $("object#FiledataUploader").height(0); 
    }, 

//workaround for bug in jQuery UI dialog/upoadify (double progress bars) 
onOpen  : function(event,ID,fileObj) { 
    $('#FiledataQueue div.uploadifyQueueItem:first-child').hide(); 
    }, 

onError: function(a, b, c, d) { 
if (d.status == 404) 
alert('Could not find upload script. Use a path relative to: ' + '<?= getcwd() ?>'); 
else if (d.type === "HTTP") 
alert('error ' + d.type + ": " + d.info); 
else if (d.type === "File Size") 
alert(c.name + ' ' + d.type + ' Limit: ' + Math.round(d.sizeLimit/1024) + 'KB'); 
else 
alert('error ' + d.type + ": " + d.info); 
}, 
onComplete : function (event, queueID, fileObj, response, data) { 
    var r = JSON.parse(response); 
    $('#token').val(r['token']);          
    $('#uploaded_filename').val(r['uploaded_filename']); 
    $('#filename_encryption').val(r['encryption']); 
    $('#FiledataQueue').html('Document <span class="bold" style="font-weight:bold;">'+ r['filename'] + '</span>'); 
}, 

onQueueFull: function(event, queueSizeLimit) { 
// supress dialog that mentions the queue is full 
return false; 
} 
}); 

HTML:

<form id="form-document" method="" action=""> 
    <input type="file" name="Filedata" id="Filedata" size="20" /> 
    <input type="hidden" name="response" id="response" value=""/> 
    <input type="hidden" name="upload_token" id="upload_token" value=""/> 
    <input type="hidden" name="uploaded_filename" id="uploaded_filename" value=""/> 
    <input type="hidden" name="filename_encryption" id="filename_encription" value=""/> 
    <input type="hidden" name="uploaded_extension" id="uploaded_extension" value=""/> 
    <input type="hidden" name="token" id="token" value="<?php echo $token['value'];?>"/> 
    </form> 

UPDATE 2: finestra

jQuery UI:

dialog_data.dialog({ 
    autoOpen: false, 
    height: 700, 
    width: 800, 
    modal: true, 
    bigframe: true, 
    buttons: { 
    'Save': function() { 
    $.ajax({ 
    type: "GET", 
    url: "<?php echo site_url();?>/upload/finish", 
    dataType: 'html', 
    data: $('#form-document').serialize(), 
    success: function(){ 
     oCache.iCacheLower = -1; 
     oTable.fnDraw(); 
     dialog_data.dialog('close'); 
    } 
    }); 
    }, 
    'Close': function() { 
    $(this).dialog('close'); 
    $('.loading').hide(); 
    } 
    }, 
    open: function(){ 
    $('.loading').hide(); 
    $("object#FiledataUploader").height(30); 
    }, 
    close: function() { 
    $('#uploaded_filename').val(''); 
    $('#filename_encription').val(''); 
    $('#FiledataQueue').html(''); 
    } 
}); 

Answer 1

Si può provare a verificare cosa succede se si dà un altro id e nome al campo del file. Filedata è la variabile utilizzata nello script di caricamento indipendentemente dall'ID/nome che dai al tuo campo e mi chiedo se non ci possa essere un conflitto.

Quindi direi prova a modificare l'ID e aggiungere il parametro id alle impostazioni uploadify (con il nuovo ID come valore) e facci sapere se questo risolve il problema.

Answer 2

Questa è la soluzione al bug?

//workaround for bug in jQuery UI dialog/upoadify (double progress bars) 
onOpen  : function(event,ID,fileObj) { 
    $('#FiledataQueue div.uploadifyQueueItem:first-child').hide(); 
    }, 

Answer 3

Questo errore in funzione assenza getAttributeNode e getAttribute nell'elemento Flash.

Variazione "jquery-min.js"

elem.getAttributeNode(name) // OR a.getAttributeNode(b) 

a

(elem.getAttributeNode?elem.getAttributeNode(name):null) // OR (a.getAttributeNode?a.getAttributeNode(b):null) 

e

elem.getAttribute(name) // OR a.getAttribute(b) 

a

(elem.getAttribute?elem.getAttribute(name):null) // OR (a.getAttribute?a.getAttribute(b):null)