-
Conteúdo Similar
-
Por Sapinn
Salva galera. Estou tentando usar o dropzone.js em um projeto mas estou tendo grandes dificuldades. Ele funciona aparentemente bem, mas não estou conseguindo enviar os arquivos para a pasta. Eu queria colocar mais de um dropzone na mesma pagina para arquivos diferentes como posso fazer isso? Outra coisa eu queria colocar todas as url de varios arquivos na mesma coluna em um formato json, isso possivel? Se sim como eu faria para chamar esses arquivos de volta e mostrar para o usuario??
-
Por Victor Penna
Bom dia pessoal, estou precisando de uma força de vocês quanto ao recurso dropzone, o que ainda estou aprendendo a trabalhar com ele.
A principio, estou precisando configura-lo no projeto da empresa, porém não estou conseguindo fazer corretamente uma zona especifica de upload na pagina do projeto. Usamos o framework Phlacon e estamos atualizando os recursos do projeto. Ja li a documentação do projeto e pesquisei no wiki do projeto(gitlab), mas até o momento ainda não entendi muita da configuração, espero que possam me ajudar a alcançar o meu objetivo.
Preciso criar uma div, que seja a dropzone e nela consiga gerar um arrays dos caminhos já inseridos pelo input, para assim tratar no controller e salva-los no banco de dados.
Atualmente o meu código está assim:
phtml:
<div class="row"> <div class="col-sm-12"> <div class="dropzone" id="dropEmp" > <?= $form->render("dsPath") ?> </div> </div> </div>
Javascript:
Dropzone.options.dropEmp = { // Prevents Dropzone from uploading dropped files immediately autoProcessQueue: false, uploadMultiple: true, parallelUploads: 100, maxFiles: 100, // Dropzone settings init: function() { var dropEmp = this; this.element.querySelector("button[type=button]").addEventListener("click", function(e) { e.preventDefault(); e.stopPropagation(); dropEmp.processQueue(); }); this.on("sendingmultiple", function() { }); this.on("successmultiple", function(files, response) { }); this.on("errormultiple", function(files, response) { }); } };
Fico no aguardo da colaboração de vocês.
Grande abraço pessoal!
-
Por AnthraxisBR
Boa tarde,
Bom estou utilizando o plugin dropzone.js pra fazer o upload de uma imagem do painel de controle:
Bom o tramite é o seguinte:
1 - > Escolhe a pagina
O código carregado ao escolher a página:
$(document).on('change', '.select-page-header-banner', function () { var $this = $(this); var value = $this.val(); $('.place-to-fill-header-banner-content').empty().html('' + '<section>' + '<div class="container section">' + '<div class="thumbnail-mod-1">' + '<img src="img/box.gif"/>' + '<p class="h5 fw-l inline-block">Carregando</p>' + '</div>' + '</div>' + '</section>' + ''); $.ajax({ type: "POST", url: "callers.php", data: {function: 'load_header_banner_content', page: value}, dataType: 'html', success: function (data) { $('.place-to-fill-header-banner-content').empty().html(data); } }); }); 2 -> Escolher a opção 'Editar imagem'
$(document).on('click', '.edit-image-header-banner', function () { $this = $(this); var page = $this.data('page'); $this.closest('.section-header-banner-image').closest('div').addClass('dropzone dropzone-file-area').prop('id', 'my-dropzone'); $this.closest('.text-header-banner-container').find('.text-header-banner').hide(); $this.closest('.section-header-banner-image').find('.edit-text-header-banner').hide(); $this.closest('.section-header-banner-image').find('.save-text-header-banner').hide(); $('.dz-default').show(); $('.dz-preview').css('dispĺay', 'block'); var element = $('#my-dropzone'); var dropzone = new Dropzone("#my-dropzone", { dictDefaultMessage: 'Solte as imagens aqui, formato recomendado 1800x400px, ou mantenha a proporção 18x4.', url: 'callers.php?function=upload_banner_image&page=' + page, success: function (file, response) { $('.bg-about-' + page).removeClass('bg-about' + page).addClass('bg-about-preview-' + page); $this.text('Confirmar imagem'); $this.closest('.section-header-banner-image').closest('div').removeClass('dropzone dropzone-file-area').removeAttr('id', 'my-dropzone'); $.ajax({ type: "POST", url: "callers.php", data: {function: 'load_header_banner_content', page: page,temp:true}, dataType: 'html', success: function (data) { $('.place-to-fill-header-banner-content').empty().html(data); } }); $('.dz-default').hide(); $('.dz-preview').hide(); } } ); });
O que muda é essa parte 2, nessa segunda parte, ao chamar a classe php que monta o campo jumbotron (bootstrap) com a imagem, ele muda a className '.bg-about-1' por '.bg-about-preview-1', indicando o carregamento da imagem temporária.
Se clicar em confirmar, ele muda a imagem da pasta temporária para a pasta padrão e substitui a imagem anterior.
Mas ao clicar em 'Outra imagem' é que está o problema, na primeira mudança, ele indica, muda a imagem do background e funciona como deveria, mas a partir da segunda mudança:
O plugin carrega ok, a imagem é carregada para o servidor, o html que contem a imagem é recarregado, mas mesmo com a imagem substituída no destino, ela não atualiza mais.
Acredito que seja algo relacionado ao cache, mas nem com as metatags funciona:
<meta http-equiv="cache-control" content="no-store, no-cache, must-revalidate, Post-Check=0, Pre-Check=0"> <meta http-equiv="expires" content="0"> <meta http-equiv="pragma" content="no-cache"> Se não for o cache, qual poderia ser outro problema causando isso ?
Esse é o retorno:
Desde ja valeu :3
-
Por Anderson Camargo
ola boa noite estou tentando criar um arquivo de upload de imagem, que cria uma nova pasta para as imagens ele recupera o id da galeria e envia deveria enviar as imagens para pasta o que não está ocorrendo.
Detalhes a pasta está sendo criada, e a imagem está sendo enviada mas não está upando para pasta criada, vou utilizar dropzone.
Segue arquivo para que possam dar uma olhada agradeço desda já a ajuda.
<?php $id = $_REQUEST['id']; $ds = DIRECTORY_SEPARATOR; //1 $storeFolder = '../ex5/galeria/'.$id.'/'; //2 if(!file_exists($storeFolder)) { mkdir('../ex5/galeria/'.$id.'/', 0777, true); } if (!empty($_FILES)) { $tempFile = $_FILES['file']['tmp_name']; //3 $targetPath = dirname( __FILE__ ) . $ds. $storeFolder . $ds; //4 $targetFile = $targetPath. $_FILES['file']['name']; //5 move_uploaded_file($tempFile,$targetFile); //6 } ?>
-