Envoi de plusieurs variables dans une page PHP avec AJAX

Invité · 29/03/2017, 12h12

Bonjour à tous,

Je suis en train d'élaborer un script qui permet de supprimer certaines photos après un choix par des checkboxs.

Pour le moment, les éléments cochés, sont récupérés dans des input hidden générés dans un formulaire html.
Celui-ci est envoyé dans une page de traitement, mais lorsque j'affiche le résultat dans la console, avant de poursuivre, plutôt que de m'afficher le nom des images une à une, il m'affiche ça (pour 3 photos/images cochées par exemple, il m'affichera 3 fois cela) :

pictures-insert.php:255 <br />

<font size='1'><table class='xdebug-error xe-notice' dir='ltr' border='1' cellspacing='0' cellpadding='1'>

<tr><th align='left' bgcolor='#f57900' colspan="5"><span style='background-color: #cc0000; color: #fce94f; font-size: x-large;'>( ! )</span> Notice: Undefined index: imgSup in C:\UwAmp\www\leSporting\admin\suppImgs.php on line <i>2</i></th></tr>

<tr><th align='left' bgcolor='#e9b96e' colspan='5'>Call Stack</th></tr>

<tr><th align='center' bgcolor='#eeeeec'>#</th><th align='left' bgcolor='#eeeeec'>Time</th><th align='left' bgcolor='#eeeeec'>Memory</th><th align='left' bgcolor='#eeeeec'>Function</th><th align='left' bgcolor='#eeeeec'>Location</th></tr>

<tr><td bgcolor='#eeeeec' align='center'>1</td><td bgcolor='#eeeeec' align='center'>0.0008</td><td bgcolor='#eeeeec' align='right'>129728</td><td bgcolor='#eeeeec'>{main}( )</td><td title='C:\UwAmp\www\leSporting\admin\suppImgs.php' bgcolor='#eeeeec'>...\suppImgs.php<b>:</b>0</td></tr>

</table></font>

Pour commencer, je vais déjà envoyé mon code php généré car puisque c'est justement un tableau qui est généré, cela donnera éventuellement d'autres informations sur mon bug (après là où je ne comprends pas trop, c'est que la valeur de la checkbox est égale au nom de l'image, donc en théorie ça n'est pas censé être tout le tableau.....)

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<?php
$chemin = './pics/';
$repertoire = opendir($chemin);
while($elements = readdir($repertoire)) {
    $liste[] = $elements;
}
 
natsort($liste);
$nbcol=5;
$liste = array_values($liste);
$nombre = count($liste);
if($nombre != 0)
{
    echo "<table class=\"gallery\">";
    for ($i=0; $i<$nombre; $i++) {
        if($i%$nbcol==0){echo '<tr>';}
        if ($liste[$i] != "." && $liste[$i] != "..") {
            if(is_dir($chemin.$liste[$i])){
                $scan_dir = array_diff(scandir($chemin.$liste[$i]), array('..', '.'));
                $nbr = count($scan_dir);
                echo "<td class=\"alb\">
                        <a href=\"details-album.php?name=".$liste[$i]."\" class=\"aLienAlbum\">
                            <div class=\"lienAlbum\" style=\"background-image: url('".$chemin.$liste[$i]."/".$scan_dir[2]."');\">
                                <h5>".$liste[$i]. "</h5>
                                <div class=\"petitFooter\">
                                    <p class=\"valign-wrapper\">";
                                        echo "(".$nbr." photos)";
                echo                "</p>
                                </div>
                            </div>
                        </a>
                      </td>";
            }
 
            // C'est cette partie qui nous intéresse !
 
            else echo   "<td class=\"imgAlb\">
                            <div>
                                <input type=\"checkbox\" class=\"imgAsup\" style=\"display:none;\" value=\"". utf8_encode($liste[$i]) ."\"/>
                                <img src=\"./pics/". utf8_encode($liste[$i]) ."\" class=\"materialboxed\" alt=\"Image\" width=\"200\" height=\"200\" />
                            </div>
                        </td>";
 
        }
        if($i%$nbcol==($nbcol-1)){echo '</tr>';}
    }
    echo "</table>";
}
else echo "<div class=\"textInfo valign-wrapper\"><p>- Aucune média à afficher -</p></div>";
 
if (isset($erreur)) echo "<br />" , $erreur;
 
closedir ($repertoire);
?>

Ensuite, mon code Jquery :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
$('.imgAsup').hide();
$('#supImgGal').on('click',function(){
    $(this).toggle();
    $('.validSup').show();
    $('.imgAlb').addClass('anim');
    $('.imgAsup').show();
    $('.alb').hide(1000);
    $("input[type=checkbox]").change(function() {
        $(this).each(function(i) {
            if (this.checked) {
                var imgASup = $(this).val();
                input = $("<input[type=hidden]/>");
                input.attr({
                    "class" : "imgASupprim",
                    "name" : "imgSup",
                    "valeur" : imgASup,
                });
                $(".formImgAsup div").append(input);
                $(".formImgAsup").submit(function(e){
                    var postData = $(this).serializeArray();
                    var formURL = $(this).attr("action");
                    $.ajax(
                    {
                        url : formURL,
                        type: "POST",
                        data : postData,
                        success:function(data, textStatus, jqXHR)
                        {
                            console.log(data);
                        },
                        error: function(jqXHR, textStatus, errorThrown)
                        {
                            alert("Attention, problème.");    
                        }
                    });
                    e.preventDefault(); //STOP default action
                });
            }
        });
    });
});

Le fameux formulaire où les input seront générés :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<form class="formImgAsup" method="POST" action="suppImgs.php">
    <div>
        //Viendront se placer ici les input générés.
    </div>
    <button type="submit" name="valid" class="validSup sup" style="display:none;"/><i class="fa fa-trash-o"></i></button>
</form>

Et mon traitement php pour le moment qui se résume à : <?php print $_POST['imgSup']; ?> (mais qui m'affiche la bêtise précisée au dessus).

J'ai pourtant sérializé mes données.... Quelqu'un peut-il m'aider ?
Bonne journée à vous !
Lucie MUTEREL