Estou com um problema de relacionamento entre a legenda e a foto durante o upload.
Eu estou fazendoo upload de multiplas fotos e cada foto possui uma legenda. O código esta mais ou menos assim
html
<!-- form via post-->
<input type="file" id="fotos" name="fotos[]" multiple/><br>
<!-- galeria gerado dinamicamente conforme é selecionado as fotos -->
<div id="galeria"></div>
javascript
//contador de fotos, aqui está o problema.
var qtdFotos=0;
function handleFileSelect(evt) {
var files = evt.target.files; // FileList object
for (var i = 0, f; f = files[i]; i++) {
// Only process image files.
if (!f.type.match('image.*')) {
continue;
}
f.id=qtdFotos;
qtdFotos++;
var reader = new FileReader();
reader.onload = (function(theFile) {
return function(e) {
var image;
image = '<div class="content-foto">';
image += '<img id="foto'+theFile.id+'" class="thumb" src="'+e.target.result+'" ></img>';
image += '<p>Descrição:</p>';
//estou usando o contador de fotos aqui para diferenciar os nomes dos input, mas não está funcionando da forma que quero.
image += '<input name="descricao_foto'+theFile.id+'" type="text"></input>';
image += '<p>Fotógrafo:</p>';
image += '<input name="fotografo_foto'+theFile.id+'" type="text"></input>';
image += '</div>';
$('#galeria').append(image);
};
})(f);
// Read in the image file as a data URL.
reader.readAsDataURL(f);
}
}
document.getElementById('fotos').addEventListener('change', handleFileSelect, false);
php
$fotos = array();
for($i=0;$i<count($_FILES['fotos']['name']);$i++){
if($files["fotos"]["error"][$i] != 0)
continue;
$foto = new Foto();
//aqui a descrição não está correspondendo com a foto.
$foto->nome = $_FILES['fotos']['name'][$i];
$foto->descricao = $_POST['descricao_foto'.$i] ;
$foto->fotografo = $_POST['fotografo_foto'.$i] ;
$foto->tmp_name = $_FILES['fotos']['tmp_name'][$i];
$fotos[] = $foto;
}
salvarFotos($fotos);
O problema eu ja identifiquei, está no contador de fotos, o for
que eu faço no javascript
não corresponde com o for
que eu faço no php
.Pois a ordem das fotos que é passado via post não é a mesma que é criado no javascript. Causando o relacionamento errado entre descricao e fotografo com a foto errada