6

Então, tenho um formulário simples de upload de imagens que eu deixo button desabilitado. Queria que, quando eu selecionar uma foto ou arquivo no input file, o button habilitar!

<div id="botoes" class="clearfix">
    <button id="btnEnvia" name="btnEnvia" class="save abre_load" disabled="true">
        SALVAR
    </button>
</div>

<div id="campos" class="clearfix">
    <label>SELECIONAR FOTOS</label>
    <input id="img" type="file" name="img[]" multiple required/>
</div>
0

2 Respostas 2

6

É possível obter os detalhes do input file pelo evento change e então habilitar o botão, algo como:

$("#img").change(function(){
  $("#btnEnvia").attr("disabled", false);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="botoes" class="clearfix">
    <button id="btnEnvia" name="btnEnvia" class="save abre_load" disabled="true">SALVAR</button>
</div>

<div id="campos" class="clearfix">
    <label>SELECIONAR FOTOS</label>
    <input id="img" type="file" name="img[]" multiple required/>
</div>

1
  • 1
    Moçada eu resolvi, coloquei o script abaixo de outros scripts no footer, provavelmente era alguma outra importação de Jquery que tava me avacalhando! Commented 29/12/2016 às 19:56
0

Você pode verificar pelo files.length usando jquery:

if ($('#img').get(0).files.length === 0) {
    //aqui você desativa o seu botão
    document.getElementById("btnEnvia").disabled = true;
    }
else
    {
      //aqui você habilita o botão
      document.getElementById("btnEnvia").disabled = false;
    }
3

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .