Contar quantidades de imagem por input file

[Jack Oliveira 1]

Ola pessoal boa noite 

 

Bom é o seguinte

 

Como eu posso fazer uma contagem de imagens que poderá ser carregado pelo input  file

Exemplos 

<!-- img1 carregar apenas 3 imagens -->
<input type="file" name="img1">

<!-- img2 carregar apenas 6 imagens -->
<input type="file" name="img2">

<!-- img3 carregar apenas 9 imagens -->
<input type="file" name="img3">

<!-- img4 carregar apenas 12 imagens -->
<input type="file" name="img4">

Ouver um jeito também de bloquear se for selecionado mais do que for permitido...

 

Já vi isso em alguns site quando for selecionar as imagens se passar da quantidade ele não seleciona mais nenhuma imagem. 

 

Se img1 ja tiver as 3 imagens nao permite selecionar ou então ocultar o input se a quantidade ja foi cadastrada..

 

Se o usuário tiver as 3 imagens e se ele apagou uma ele podera selecionar apenas uma e nada mais...

 

Se teria como fazer isso apenas com php ou teria que usar jquery ou javascript..

 

Espero que possam entender..

 

 

Obs: não precisa ser codigo grande pra pouca coisa; que possa ser mais simplificado possível..

[Omar~ 87]

Gostei da questão, nunca havia feito nada a respeito disso.

Pois sempre limitei o upload a um único arquivo de vez.

 

Enfim fiz algo assim: O usuário pode selecionar vários arquivos, se ele selecionar mais de 3 simplesmente redefino os arquivos selecionados no input, na verdade a função só irá pegar os 3 primeiros arquivos que ele selecionar e vai definir o valor do input com esses.

<input
    id="exemplo"
    multiple=""
    type="file"
    style="display: none"
    accept="image/*" />
<label for="exemplo">Selecionar Imagens</label>

<script>
    var exemplo = document.getElementById('exemplo'),
        dataT = new DataTransfer();

    exemplo.addEventListener('change', function (e) {
        var alvo = e.target,
            selecionados = alvo.files;
        for (var i = 0; i < selecionados.length; i++) {
            if (i < 3) {
                dataT.items.add(selecionados[i]);
                alvo.nextElementSibling.innerHTML += ' ' + selecionados[i].name + '/';
            }
        }
        alvo.files = dataT.files;
    }, false);
</script>

Acho que não precisaria lembrar, mas é bom...

Você também terá que fazer uma verificação no servidor quando o usuário enviar os arquivos.

E é muito simples, basta executar um loop com o laço for no array $_FILES do input, tudo índice que for maior que 3 você vai aplicando a função unset neles.

 

De qualquer forma pelo javascript quando estava fazendo esse simples exemplo pude perceber um leque de infinitas possibilidades para a situação, dar para fazer cada coisa bacana a respeito, porém requer scripts mais complexos e detalhados, não sendo viável para um simples post aqui no fórum.

[Jack Oliveira 1]

Ola Omar perfeito mano, 

questão dos input na verdade sera apenas um mesmo, fiz da forma la para poder entender da melhor forma o que estava precisando

 

pois a quantidade será feita conforma será o plano de cada usuario mesmo, mais da forma que tu montou ja me ajuda obrigado novamente