Taking data jQuery

Asked

Viewed 97 times

1

I am developing an image upload where it is possible to upload multiple images. When people choose their images along with Preview on jQuery, I show 2 fields, one from the link and another from the caption of the image. However, when the person clicks on save, I can’t get these two fields, the rest goes perfectly. What can 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;

?>
  • Where is the HTML to save and what code this function runs?

  • There is no HTML code but PHP, and this already is there. and what is the code to go through the function ? do not know what is ?

  • You have the question "But when the person clicks to save,"... where is that code?

  • I did not present in it because, is just redirect to PHP page quoted, there is no more important information on another page referring to what I want, so if it is not written in the code above I did not develop, because I am not understanding, because I need help to finish.

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.