How to send array files via ajax?

3
Well I have a script that inserts the posts in the database now I am trying to upload images together with the post I am trying to send problems with array of input file to the file where I'll handle the upload how can I do this?

Script that adds posts

  <script>
    $(function() {
    $(".submit_button").click(function() {
        var textcontent = $("#opiniao").val();
        id_usuario = "<?php echo $_SESSION['user_id'] ?>";
        var dataString = 'id_estabelecimento=<?php echo $row->id; ?>&user_id='+id_usuario+'&opiniao='+textcontent;
        if(textcontent==''){
            alert("Por favor escreva uma opinião..");
            $("#opiniao").focus();
        }else{
            if(id_usuario == ''){
                alert("Para escrever uma opinião precisar estar logado aceda ao menu login para entrar na sua conta")
            }else{
                $("#flash").show();
                $("#flash").fadeIn(400).html('<span class="load">Aguarde por favor..</span>');
                $.ajax({
                    type: "POST",
                    url: "ajax/processa_post.php",
                    data: dataString,
                    cache: false,
                    success: function(html){
                        $("#show").after(html);
                        document.getElementById('opiniao').value='';
                        $("#flash").hide();
                        $("#opiniao").focus();
                    }  
                });
            }
        }
        return false;
    });
});
</script>

HTML Form

<form  method="post" name="form" action="" enctype="multipart/form-data" >
<input type="hidden" name="valida" id="valida" value="ok" />
    <div id='share-container'>
    <section class="container" style="margin:0px 0px 20px 0px; border-radius: 2px;">
        <h3>Opiniões</h3>
        <table border="0" width="100%" cellpadding="0" cellspacing="0">
            <tr>
                <td valign="top">
                    <textarea style="border:none;" placeholder="Em que estás a pensar?" id="opiniao" name="opiniao"></textarea>
                </td>   
           </tr>
            <tr>
                <td valign="top">
                    <div style="background-color:#FFF;">
                        <div style="float:right; padding:5px 5px 5px 5px;"><input type="submit" value="Publicar" name="submit" class="submit_button"/></div>
                        <div style="padding:15px 5px 5px 5px; float:right;"><input id="fb" name="fb" type="checkbox" />Facebook</div>
                        <div style="padding:15px 5px 5px 5px; float:right;"><input type="checkbox" />Twitter</div>
                        <label style="padding:16px 20px 5px 5px; float:right;" for="fotos_post">
                            <img src="img/fotos.png" alt="">
                        </label>
                        <input name="fotos_post[]" id="fotos_post" class="upload_post" type="file" multiple="" />
                    </div>
                </td>
           </tr>
        </table>
    </section>
    </div>
    <!--//one-half-->
</form>

Processa_posts.php file

<?php
session_start();
require_once("../gtm/bd/funcoes.php");
ligarBd();  
mysql_query("SET NAMES 'utf8'");

if(isset($_POST['opiniao'])){
    if(!isset($_SESSION['user_id'])){
        echo "
        <script>
            window.location = 'http://sabeonde.pt/index.php?m=login';
        </script>
        ";
    }else{
        mysql_query("INSERT INTO posts (user_id, estabelecimento_id, opiniao, data) VALUES('".$_REQUEST['user_id']."', '".$_REQUEST['id_estabelecimento']."', '".$_REQUEST['opiniao']."', now()) ");  
        $fetch= mysql_query("SELECT * from posts where estabelecimento_id='".$_REQUEST['id_estabelecimento']."' order by data desc");
        $row=mysql_fetch_array($fetch);
    }
}
?>
<section class="container" style="margin:15px 0px 0px 0px;">
<table border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td valign="top">
           <div style="float:left; margin:0px 0px 10px 0px; "><img width="50" height="50" src="<?php echo $_SESSION['user_foto'] ?>"/></div>
           <h3 style="float:left; margin:15px 0px 0px 10px;"><?php echo utf8_encode($_SESSION['nome']); ?></h3>
        </td>
    </tr>
</table>      
<p><?php echo utf8_encode($row['opiniao']); ?></p>
</section>
<table border="0" bgcolor="#E9EAED" width="100%" cellpadding="0" cellspacing="0">
    <tr>
        <td valign="top" width="10%">
            <div style="padding:15px 5px 5px 20px;"><img width="33" height="33" src="<?php echo $_SESSION['user_foto'] ?>"/></div>
        </td>
        <td valign="top" width="90%">
            <div style="padding:15px 20px 5px 5px;"><textarea style="border:none; width:100%; height:33px;" placeholder="Escreve um comentário..." id="" name=""></textarea></div>
        </td>
    </tr>
</table>

In this file I want to retrieve the files that were chosen to upload through $_FILES

    
asked by anonymous 03.03.2015 / 22:39

2 answers

1

I do not know if I understood very well whether I want AJAX for PHP or the reverse, so I put both:

1-To send from JAVASCRIPT you have to make the array a json string:

$.ajax({
    url: 'request/exemplo.php',
    data: JSON.stringify(fields),
    type: "POST"....

In php just get $ _POST, but do not forget json_decode ($ post ['variable name']).

2-In the response from ... processa_post.php return your array like this:

echo json_encode(array());

Then in AJAX success, place:

...
success: function (data) {
   var json_object = JSON.parse(data);
   (agora é só utilizar dentro do javascript)
}
...
    
03.03.2015 / 23:32
0

I understand what you want, but I do not think it's possible with a simple script, because the plugins that do this are very complex. I would recommend a ready-made javascript / php plugin you upload like jQuery-File-Upload or < a href="http://www.plupload.com/examples/"> Plupload

    
03.03.2015 / 23:42