bonjour a tous
j ai un copain qui m a gentiment fourni un code pour uploader des images
malheureusement je n ai plus de ses nouvelles
et j aurais souhaiter pouvoir afficher des alert si le format n est pas une image ou si la taille est trop grande

c est la dernière chose qui me manque pour finaliser mon site
et n y connaissant rien en javascript
je viens demander votre aide

voici le code du bouton qui envois l image

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
  <button type="button" name="photo" value="Upload" onclick="submitUploadFileForm()" class="btn btn-primary btn-lg" style="width: 100px;height: 50px;color: #FFF;">Envoyer</button>

et le code javascript

Code html : 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
55
56
57
58
59
60
61
    <script>
        var pseudo = '<?php echo $pseudo;?>';
        var id = '<?php echo $id ;?>';
        console.log('ID', id, 'PSEUDO', pseudo); // pour voir si les variables se remplissent bien dans la console;..
        function _(el) {
            return document.getElementById(el);
        }
        
        function uploadFile() {
            var file = _("photo").files[0];
            var input_contenu = _("contenu");
            var contenu = input_contenu.value;
            var formdata = new FormData();
            formdata.append("photo", file);
            formdata.append("pseudo", pseudo);
            formdata.append("id", id);
            formdata.append("contenu", contenu);
            //le temps des tests : 
            //alert('pseudo:' + pseudo + '  id: ' + id+ '  contenu: ' + contenu);
            console.log('ID', id, 'PSEUDO', pseudo, 'CONTENU', contenu); // pour voir si les variables se remplissent bien dans la console;..
            var ajax = new XMLHttpRequest();
            ajax.upload.addEventListener("progress", progressHandler, false);
            ajax.addEventListener("load", completeHandler, false);
            ajax.addEventListener("error", errorHandler, false);
            ajax.addEventListener("abort", abortHandler, false);
            ajax.open("POST", "cible-fichier.php"); // http://www.developphp.com/video/JavaScript/File-Upload-Progress-Bar-Meter-Tutorial-Ajax-PHP
            //use file_upload_parser.php from above url
            ajax.send(formdata);
        }
 
        function progressHandler(event) {
            _("loaded_n_total").innerHTML = "Uploaded " + event.loaded + " bytes of " + event.total;
            var percent = (event.loaded / event.total) * 100;
            _("progressBar").value = Math.round(percent);
            _("status").innerHTML = Math.round(percent) + "% uploaded... please wait";
        }
 
        function completeHandler(event) {
            let res = typeof(event.target.responseText) != 'undefined' ? JSON.parse(event.target.responseText) : "";
            document.getElementById("photo").value = "";
            document.getElementById("contenu").value = "";
            let message = typeof(res.message) != 'undefined' ? res.message : "";
            let error = typeof(res.error) != 'undefined' ? res.error : null;
            _("status").innerHTML = error ? error : messagepas bon ;
            _("progressBar").value = 0; //wil clear progress bar after successful upload
        }
 
        function errorHandler(event) {
            _("status").innerHTML = "Upload Failed";
        }
 
        function abortHandler(event) {
            _("status").innerHTML = "Upload Aborted";
        }
 
function submitUploadFileForm(){
  if (document.getElementById('form_upload').reportValidity()) {
    uploadFile();
  }
}
    </script>