Visualizzazione dei risultati da 1 a 4 su 4

Discussione: Pulsante in DROPZONE

  1. #1
    Utente di HTML.it
    Registrato dal
    Jul 2007
    Messaggi
    371

    Pulsante in DROPZONE

    Salve sto provando ad aggiungere un pulsante "start" nell'anteprima del file da importare ma non mi funziona cosa sbaglio ???
    Grazie in anticipo ragazzi ...
    codice:
    <div id="file-upload">    <div class="panel panel-light">        <div class="panel-heading">            <div class="panel-title">                <h4>Importa Dati</h4>            </div>        </div>        <div class="panel-body">            <section>              <div id="dropzone">                <form class="dropzone needsclick" id="demo-upload" action="/upload">                  <div class="dz-message needsclick">                      Trascina file qui o click per upload.<br>                      <span class="note needsclick fa fa-download fa-4x" style="color:blue"></span>                  </div>                </form>              </div>            </section>          <hr size="3" noshade color="#F00000">          <div id="preview-template" style="display: none;">            <div class="dz-preview dz-file-preview">              <div class="dz-image"><img data-dz-thumbnail=""></div>              <div class="dz-details">                <div class="dz-size"><span data-dz-size=""></span></div>                <div class="dz-filename"><span data-dz-name=""></span></div>              </div>              <div class="dz-progress"><span class="dz-upload" data-dz-uploadprogress=""></span></div>              <div class="dz-error-message"><span data-dz-errormessage=""></span></div>              <div class="dz-success-mark"></div>              <div class="dz-error-mark"></div>              <button class="btn btn-primary start">Start</button>            </div>          </div>          <a type='button' class='btn btn-success btn-lg dz-view addData' title='Visualizza Dati'>Visualizza File</a>        </div>    </div></div><!-- Modal Form --><div id="add_data_import_wbs" class="modal fade bd-example-modal-lg" style="font-size:10px;">      <div class="modal-dialog center">           <div class="modal-content">                <div class="modal-header">                     <h4 class="modal-title">Dati che verranno Importati</h4>                     <button type="button" class="close" data-dismiss="modal">&times;</button>                </div>                <div class="modal-body" style="width:100%">                   <form method="post" id="insert_form" name="insert_form" class="needs-validation" novalidate>                         <div id="result" style="width:100%"></div>                         <div class="modal-footer">                           <button type="submit" class="btn btn-success" name="insert" id="insert" value="Insert"/><i class="fa fa-refresh"></i> Importa Dati</button>                           <button type="button" class="btn btn-dark" data-dismiss="modal"><i class="fa fa-sign-out"></i> Esci</button>                        </div>                  </form>                </div>          </div>    </div></div>    <script type="text/javascript">        LobiAdmin.loadScript('js/plugin/dropzone/dropzone.min.js', initPage);        function initPage(){          $(".addData").click(function(){            alert("addData");          });          $(".start").click(function() {            alert("start");                    });             var dropzone = new Dropzone('#demo-upload', {               previewTemplate: document.querySelector('#preview-template').innerHTML,               parallelUploads: 2,               autoProcessQueue: false,               thumbnailHeight: 120,               thumbnailWidth: 120,               maxFilesize: 3,               validation: {                    allowedExtensions: [".xls", ".html", ".xlsx"]               },               showFileList: false,               addRemoveLinks: true,               filesizeBase: 1000,               dictRemoveFile:"Rimuovi File",               thumbnail: function(file, dataUrl) {               if (file.previewElement) {                   file.previewElement.classList.remove("dz-file-preview");                   var images = file.previewElement.querySelectorAll("[data-dz-thumbnail]");                   for (var i = 0; i < images.length; i++) {                     var thumbnailElement = images[i];                     thumbnailElement.alt = file.name;                     thumbnailElement.src = dataUrl;                   }                   setTimeout(function() { file.previewElement.classList.add("dz-image-preview"); }, 1);                 }               },             });
            }
        </script></div>

  2. #2
    Amministratore L'avatar di Vincent.Zeno
    Registrato dal
    May 2003
    residenza
    Emilia-Romagna (tortellini und cappelletti land!)
    Messaggi
    20,783
    per favore indenta il codice in maniera leggibile agli umani,
    altrimenti è difficile che qualcuno tenti di aiutarti.

    riformula anche la questione... non ho capito cosa dovrebbe essere "un pulsante 'start' nell'anteprima del file"...

  3. #3
    Utente di HTML.it
    Registrato dal
    Jul 2007
    Messaggi
    371
    codice:
    <div id="file-upload">
        <div class="panel panel-light">
            <div class="panel-heading">
                <div class="panel-title">
                    <h4>Importa Dati Wbs</h4>
                </div>
            </div>
            <div class="panel-body">
                <section>
                  <div id="dropzone">
                    <form class="dropzone needsclick" id="demo-upload" action="/upload">
                      <div class="dz-message needsclick">
                          Trascina file qui o click per upload.<br>
                          <span class="note needsclick fa fa-download fa-4x" style="color:blue"></span>
                      </div>
                    </form>
                  </div>
                </section>
              <hr size="3" noshade color="#F00000">
              <div id="preview-template" style="display: none;">
                <div class="dz-preview dz-file-preview">
                  <div class="dz-image"><img data-dz-thumbnail=""></div>
                  <div class="dz-details">
                    <div class="dz-size"><span data-dz-size=""></span></div>
                    <div class="dz-filename"><span data-dz-name=""></span></div>
                  </div>
                  <div class="dz-progress"><span class="dz-upload" data-dz-uploadprogress=""></span></div>
                  <div class="dz-error-message"><span data-dz-errormessage=""></span></div>
                  <div class="dz-success-mark"></div>
                  <div class="dz-error-mark"></div>
                  <button class="btn btn-primary start">Start</button>
                </div>
              </div>
              <a type='button' class='btn btn-success btn-lg dz-view addData' title='Visualizza Dati'>Visualizza File</a>
            </div>
        </div>
    </div>
    <!-- Modal Form -->
    <div id="add_data_import_wbs" class="modal fade bd-example-modal-lg" style="font-size:10px;">
          <div class="modal-dialog center">
               <div class="modal-content">
                    <div class="modal-header">
                         <h4 class="modal-title">Dati che verranno Importati</h4>
                         <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>
                    <div class="modal-body" style="width:100%">
                       <form method="post" id="insert_form" name="insert_form" class="needs-validation" novalidate>
                             <div id="result" style="width:100%"></div>
                             <div class="modal-footer">
                               <button type='submit' name='insert' id='insert' value="Insert" class='btn btn-labeled btn-success' title='Importa Dati'><span class='btn-label'><span class='fa fa-refresh'></span></span>Importa Dati</button>
                               <button type="button" class="btn btn-dark" data-dismiss="modal"><i class="fa fa-sign-out"></i> Esci</button>
                            </div>
                      </form>
                    </div>
              </div>
        </div>
    </div>
        <script type="text/javascript">
            LobiAdmin.loadScript('js/plugin/dropzone/dropzone.min.js', initPage);
            function initPage(){
              $(".addData").click(function(){
              alert("AddData");
              });
              /*-----IMPORTA DATI-----*/
              $("#insert").click(function(){
                 $('#add_data_Modal').modal('hide');
                 sendTblDataToServer();
              });
    
    
              $(".start").click(function() {
                alert("start");
              });
                 var dropzone = new Dropzone('#demo-upload', {
                   previewTemplate: document.querySelector('#preview-template').innerHTML,
                   parallelUploads: 2,
                   autoProcessQueue: false,
                   thumbnailHeight: 120,
                   thumbnailWidth: 120,
                   maxFilesize: 3,
                   validation: {
                        allowedExtensions: [".xls", ".html", ".xlsx"]
                   },
                   showFileList: false,
                   addRemoveLinks: true,
                   filesizeBase: 1000,
                   dictRemoveFile:"Rimuovi File",
                   thumbnail: function(file, dataUrl) {
                       if (file.previewElement) {
                           file.previewElement.classList.remove("dz-file-preview");
                           var images = file.previewElement.querySelectorAll("[data-dz-thumbnail]");
                           for (var i = 0; i < images.length; i++) {
                             var thumbnailElement = images[i];
                             thumbnailElement.alt = file.name;
                             thumbnailElement.src = dataUrl;
                           }
                           setTimeout(function() { file.previewElement.classList.add("dz-image-preview"); }, 1);
                         }
                       },
                 });
            }
        </script>
    </div>

  4. #4
    Utente di HTML.it
    Registrato dal
    Jul 2007
    Messaggi
    371
    mi necessita che il pulsante "start" che sta nell'anteprima del file (preview-template) mi dia il nome del file.

    Quote Originariamente inviata da max1974 Visualizza il messaggio
    codice:
    <div id="file-upload">
        <div class="panel panel-light">
            <div class="panel-heading">
                <div class="panel-title">
                    <h4>Importa Dati Wbs</h4>
                </div>
            </div>
            <div class="panel-body">
                <section>
                  <div id="dropzone">
                    <form class="dropzone needsclick" id="demo-upload" action="/upload">
                      <div class="dz-message needsclick">
                          Trascina file qui o click per upload.<br>
                          <span class="note needsclick fa fa-download fa-4x" style="color:blue"></span>
                      </div>
                    </form>
                  </div>
                </section>
              <hr size="3" noshade color="#F00000">
              <div id="preview-template" style="display: none;">
                <div class="dz-preview dz-file-preview">
                  <div class="dz-image"><img data-dz-thumbnail=""></div>
                  <div class="dz-details">
                    <div class="dz-size"><span data-dz-size=""></span></div>
                    <div class="dz-filename"><span data-dz-name=""></span></div>
                  </div>
                  <div class="dz-progress"><span class="dz-upload" data-dz-uploadprogress=""></span></div>
                  <div class="dz-error-message"><span data-dz-errormessage=""></span></div>
                  <div class="dz-success-mark"></div>
                  <div class="dz-error-mark"></div>
                  <button class="btn btn-primary start">Start</button>
                </div>
              </div>
              <a type='button' class='btn btn-success btn-lg dz-view addData' title='Visualizza Dati'>Visualizza File</a>
            </div>
        </div>
    </div>
    <!-- Modal Form -->
    <div id="add_data_import_wbs" class="modal fade bd-example-modal-lg" style="font-size:10px;">
          <div class="modal-dialog center">
               <div class="modal-content">
                    <div class="modal-header">
                         <h4 class="modal-title">Dati che verranno Importati</h4>
                         <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>
                    <div class="modal-body" style="width:100%">
                       <form method="post" id="insert_form" name="insert_form" class="needs-validation" novalidate>
                             <div id="result" style="width:100%"></div>
                             <div class="modal-footer">
                               <button type='submit' name='insert' id='insert' value="Insert" class='btn btn-labeled btn-success' title='Importa Dati'><span class='btn-label'><span class='fa fa-refresh'></span></span>Importa Dati</button>
                               <button type="button" class="btn btn-dark" data-dismiss="modal"><i class="fa fa-sign-out"></i> Esci</button>
                            </div>
                      </form>
                    </div>
              </div>
        </div>
    </div>
        <script type="text/javascript">
            LobiAdmin.loadScript('js/plugin/dropzone/dropzone.min.js', initPage);
            function initPage(){
              $(".addData").click(function(){
              alert("AddData");
              });
              /*-----IMPORTA DATI-----*/
              $("#insert").click(function(){
                 $('#add_data_Modal').modal('hide');
                 sendTblDataToServer();
              });
    
    
              $(".start").click(function() {
                alert("start");
              });
                 var dropzone = new Dropzone('#demo-upload', {
                   previewTemplate: document.querySelector('#preview-template').innerHTML,
                   parallelUploads: 2,
                   autoProcessQueue: false,
                   thumbnailHeight: 120,
                   thumbnailWidth: 120,
                   maxFilesize: 3,
                   validation: {
                        allowedExtensions: [".xls", ".html", ".xlsx"]
                   },
                   showFileList: false,
                   addRemoveLinks: true,
                   filesizeBase: 1000,
                   dictRemoveFile:"Rimuovi File",
                   thumbnail: function(file, dataUrl) {
                       if (file.previewElement) {
                           file.previewElement.classList.remove("dz-file-preview");
                           var images = file.previewElement.querySelectorAll("[data-dz-thumbnail]");
                           for (var i = 0; i < images.length; i++) {
                             var thumbnailElement = images[i];
                             thumbnailElement.alt = file.name;
                             thumbnailElement.src = dataUrl;
                           }
                           setTimeout(function() { file.previewElement.classList.add("dz-image-preview"); }, 1);
                         }
                       },
                 });
            }
        </script>
    </div>

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.