I'm developing an image upload, where you can upload multiple images. When people choose their images, along with Preview in jQuery
, I show 2 fields, one of the link and another of the caption of the image. However, when the person clicks save, I can not get these two fields, the rest goes perfectly. What can it be?
The code of the main page:
<div class="span6 upl">
<div id="tamb">Tamanho esperado: 586px x 184px</div>
<input id="files" name="files[]" type="file" multiple />
<output id="result" />
</div>
The js code:
<script>
window.onload = function(){
//Check File API support
if(window.File && window.FileList && window.FileReader)
{
var filesInput = document.getElementById("files");
filesInput.addEventListener("change", function(event){
var files = event.target.files; //FileList object
var output = document.getElementById("result");
for(var i = 0; i< files.length; i++)
{
var file = files[i];
//Only pics
if(!file.type.match('image'))
continue;
var picReader = new FileReader();
picReader.addEventListener("load",function(event){
var picFile = event.target;
var div = document.createElement("div");
div.innerHTML = "<img class='thumbnail' src='" + picFile.result + "'" +
"title='" + picFile.name + "'/> <a href='#' class='remove_pict del'><i class=\"icon-remove\"></i></a> <div class=\"control-group\"> <label class=\"control-label\" for=\"MEM_LEGEN_IMAGM\">Legenda</label> <div class=\"controls\"><input id=\"MEM_LEGEN_IMAGM\" name=\"MEM_LEGEN_IMAGM\" type=\"text\" class=\"input-xlarge\"> </div> </div> <div class=\"control-group pull-right linkImg\"><label class=\"control-label\" for=\"TXT_LINKX_URLXX\">Link</label><div class=\"controls\"><input id=\"TXT_LINKX_URLXX\" name=\"TXT_LINKX_URLXX\" type=\"text\" class=\"input-xlarge\"> </div> </div>";
output.insertBefore(div,null);
div.children[1].addEventListener("click", function(event){
div.parentNode.removeChild(div);
});
});
//Read the image
picReader.readAsDataURL(file);
}
});
}
else
{
console.log("Your browser does not support File API");
}
}
</script>
And finally, the PHP code:
<?php
// incluindo o arquivo que faz a conexao com o banco
include ("../includes/conexao.php");
include ("../includes/suc_validacao.php");
include ("../includes/suc.php");
$cdClie = $_POST['COD_IDENT_CLIEN'];
$titulo = $_POST['TXT_TITUL_PUBLI'];
$status = $_POST['FLG_STATU_PUBLI'];
$resumo = $_POST['TXT_RESMO_PUBLI'];
$msg = $_POST['TXT_DETLH_PUBLI'];
$link = $_POST['TXT_LINKX_URLXX'];
$usurLoga = $_SESSION['UsuarioID'];
//INFO IMAGEM
$file = $_FILES['files'];
$numFile = count(array_filter($file['name']));
$query = "INSERT INTO tbl_PUBLICACOES (COD_IDENT_CLIEN, TXT_TITUL_PUBLI, FLG_STATU_PUBLI, FLG_TIPOX_PAGIN, TXT_RESMO_PUBLI, TXT_DETLH_PUBLI, TXT_LINKX_URLXX, COD_IDULT_ATUAL, DAT_ULTIM_ATUAL) VALUES";
$query .= "('$cdClie','$titulo','$status','012','$resumo','$msg','$link','$usurLoga', now())";
$inserir = mysql_query($query)
or die(error());
$COD_IDENT_ULTIM_PUBLI = mysql_insert_id();
$response = array("success" => true);
// Recebeu a imagem
if($numFile != NULL):
//PASTA
$folder = '../uploads';
//REQUISITOS
$permite = array('image/jpeg', 'image/png', 'image/jpg');
$maxSize = 1024 * 1024 * 5;
//MENSAGENS
$msg = array();
$errorMsg = array(
1 => 'O arquivo no upload é maior do que o limite definido em upload_max_filesize no php.ini.',
2 => 'O arquivo ultrapassa o limite de tamanho em MAX_FILE_SIZE que foi especificado no formulário HTML',
3 => 'o upload do arquivo foi feito parcialmente',
4 => 'Não foi feito o upload do arquivo'
);
if($numFile <= 0)
echo 'Selecione uma Imagem!';
else{
for($i = 0; $i < $numFile; $i++){
$name = $file['name'][$i];
$type = $file['type'][$i];
$size = $file['size'][$i];
$error = $file['error'][$i];
$tmp = $file['tmp_name'][$i];
$legend = $file['MEM_LEGEN_IMAGM'][$i];
$link = $file['TXT_LINKX_URLXX'][$i];
$extensao = @end(explode('.', $name));
$novoNome = rand().".$extensao";
if($error != 0)
$msg[] = "<b>$name :</b> ".$errorMsg[$error];
else if(!in_array($type, $permite))
$msg[] = "<b>$name :</b> Erro imagem não suportada!";
else if($size > $maxSize)
$msg[] = "<b>$name :</b> Erro imagem ultrapassa o limite de 5MB";
else{
if(move_uploaded_file($tmp, $folder.'/'.$novoNome)){
$sql = mysql_query("INSERT INTO tbl_IMAGENS (TXT_FILEN_IMAGN, MEM_LEGEN_IMAGM, TXT_LINKX_URLXX, FLG_TIPOX_IMAGEM, COD_IDULT_ATUAL, DAT_ULTIM_ATUAL) VALUES ('".$novoNome."', '".$legend."', '".$link."', 'I', '".$usurLoga."', now())");
$COD_IDENT_ULTIM_IMAGE = mysql_insert_id();
$sql2 = mysql_query("INSERT INTO tbl_PUBLICACOESxIMAGENS ( COD_IDENT_PUBLI, COD_SEQUN_IMAGM) VALUES ('".$COD_IDENT_ULTIM_PUBLI."', '".$COD_IDENT_ULTIM_IMAGE."')");
}else
$msg[] = "<b>$name :</b> Desculpe! Ocorreu um erro...";
}
foreach($msg as $pop)
echo $pop.'<br>';
}
}
endif;
mysql_close($conn);
header("Location: publicacaoPF.php?P_COD_IDENT_CLIEN=$cdClie"); exit;
?>