Bonjour à tous,
je voudrais savoir comment on peut limiter le nombre d'images une fois chargées. je ne veux pas limiter le nombre d'images à charger en même temps défini avec files.length >3 par exemple.
Une fois les images chargées et affichées, je voudrais afficher un message "pas plus de 3 images" et que l'utilisateur ne puisse plus charger d'autres images.

J'ai 2 fichiers : 1 html contenant le formulaire et 1 PHP pour traiter l'insertion en base sql via POST

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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
$('#multiple_files').change(function(){
  var error_images = '';
  var form_data = new FormData();
  var files = $('#multiple_files')[0].files;
 
  for(var i=0; i<files.length; i++)
   {
 
    var name = document.getElementById("multiple_files").files[i].name;
    var ext = name.split('.').pop().toLowerCase();
    if(jQuery.inArray(ext, ['gif','png','jpg','jpeg']) == -1) 
    {
     error_images += '<p>Fichier invalide !</p>';
    }
    var oFReader = new FileReader();
    oFReader.readAsDataURL(document.getElementById("multiple_files").files[i]);
    var f = document.getElementById("multiple_files").files[i];
    var fsize = f.size||f.fileSize;
    if(fsize > 200000)
    {
     error_images += '<p>L\'image est trop grosse</p>';
    }
    else
    {
     form_data.append("file[]", document.getElementById('multiple_files').files[i]);
    }
 
	}
 
	if(files.length > 3)
  {
   error_images += 'Vous ne pouvez pas t&eacute;l&eacute;charger plus de 3 images';
  }
 
 
  if(error_images == '')
  {
   $.ajax({
    url:"upload.php",
    method:"POST",
    data: form_data,
    contentType: false,
    cache: false,
    processData: false,
 
    beforeSend:function(){
     $('#error_multiple_files').html('<br /><label class="text-primary"><i class="fa fa-cog fa-spin fa-fw"></i> T&eacute;l&eacute;chargement en cours...</label>');
 
    }, 
 
    success:function(data)
    {
     $('#error_multiple_files').html('<br /><label class="text-success"><i class="fa fa-check" aria-hidden="true"></i> T&eacute;l&eacute;chargement termin&eacute;</label>');
     load_image_data();
    }
 
   });
 
  }
  else
  {
   $('#multiple_files').val('');
   $('#error_multiple_files').html("<span class='text-danger'>"+error_images+"</span>");
   return false;
  }
 });
Merci de vos idées