-1

Como posso fazer um input[type="file"] selecionar apenas pasta, ao invés de arquivos?

Eu utilizei a marcação:
<input type="file" multiple webkitdirectory>


Mas pelo visto, ele seleciona os arquivos da pasta. Exibindo: inserir a descrição da imagem aqui


1
  • Mas ao acessar a pasta, você vai estar selecionando os arquivos internos também. Commented 22/02/2019 às 15:14

1 Resposta 1

1

Solução

Você pode pegar o caminho completo de um arquivo e apenas remover o nome do arquivo

Código

O código abaixo esta comentado explicando o seu funcionamento.

$('[type="file"]').on("change", function(event) {

  //Pega apenas um arquivo
  let file = event.target.files[0];
  
  //Pega o caminho do arquivo
  let caminho = file.webkitRelativePath;
  
  //Desmonta o caminho em um array
  let arrayPath = caminho.split('/');
  
  //Remove só o arquivo do caminho
  arrayPath.pop();
  
  //Controi o caminho denovo
  console.log(arrayPath.join('/'));
  
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="file" id="ctrl" webkitdirectory directory multiple/>

AJuda

How to get folder directory from HTML input type “file” or any other way?

HTMLInputElement.webkitdirectory

Observação importante

Se o seu projeto for uma aplicação web, apesar de conseguir pegar o caminho da pasta, você não poderá utilizar ele para manipular no futuro.

Caso precise destes arquivos, você terá que salvar no seu servidor, e então manipular, já que o seu servidor não terá mais acesso a pasta do seu usuário.

1
  • Muito bom, muito obrigado. Achei de um jeito parecido, mas o seu esta melhor. Tem como eu exibir o diretório? Por exemplo: "C:/pasta-teste/pasta-um" ao invés de apenas a pasta, como "pasta-um". Commented 22/02/2019 às 15:54

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 .