2016-08-27 57 views
1

私は、フォーム、次のしているはありませんURLは:ドロップゾーン:不明なエラー:

<script src="assets/js/dropzone.js"></script> 

そして、私自身のドロップゾーンのmyDropzone.js:

<form class="block-center" id="pdfForm" method="POST" action="form_threatment.php" enctype="multipart/form-data" style="margin-top: 30px;">  
    <div class="form-group push-50-t col-md-12"> 
    <div class="col-md-12"> 
     <div class="form-material form-material-primary">  
     <div class="dropzone dropzone-previews" id="pdfFile"> 
     </div>  
     </div> 
    </div> 
    </div>  
</div> 

<div class="form-group push-50-t col-md-6"> 
    <div class="col-md-12"> 
    <div class="form-material form-material-primary">        
     <input class="form-control" name="first_name" type="text" id="first_name" /> 
     <label for="first_name"><span class="asterix">*</span> Prénom : </label>      
    </div> 
    </div> 
</div> 

私はこのようなdropzone.jsライブラリが含まれます

<script src="assets/js/myDropzone.js"></script> 

myDropzone.jsファイルでは、div#pdfFileをこのように設定しました:

Dropzone.autoDiscover = false; 

$(document).ready(function() {  

    Dropzone.options.pdfFile = { 
     // url does not has to be written if we have wrote action in the form tag but i have mentioned here just for convenience sake 
     url: 'form_threatment.php', 
     acceptedFiles: '.pdf', 
     maxFilesize: 20, 
     addRemoveLinks: true, 
     autoProcessQueue: false, // this is important as you dont want form to be submitted unless you have clicked the submit button 
     uploadMultiple: false, 
     autoDiscover: false, 
     paramName: 'pdf', // this is optional Like this one will get accessed in php by writing $_FILE['pic'] // if you dont specify it then by default it taked 'file' as paramName eg: $_FILE['file'] 
     previewsContainer: '#pdfFile', // we specify on which div id we must show the files 
     clickable: false, // this tells that the dropzone will not be clickable . we have to do it because v dont want the whole form to be clickable 

     accept: function(file, done) { 
      console.log("uploaded"); 
      done(); 
     }, 
     error: function(file, msg){ 
      alert(msg); 
     }, 
     init: function() { 
      var myDropzone = this; 

      // #submit-all it the id of the submit button 
      $("#submit-all").on("click", function(e) { 
       var files = $('#pdfFile').get(0).dropzone.getAcceptedFiles(); 
       console.log(myDropzone); 
       console.log(files); 
       //e.preventDefault(); 
       //e.stopPropagation(); 
       myDropzone.processQueue(); // this will submit your form to the specified action path 
       // after this, your whole form will get submitted with all the inputs + your files and the php code will remain as usual 
       //REMEMBER you DON'T have to call ajax or anything by yourself, dropzone will take care of that 

      });            
     } 
    }; 
    Dropzone.options.pdfFile.init(); 
}); 

ページをロードするとき、私はエラーを取得:

Uncaught Error: No URL provided.

以前、私はセットアップにドロップゾーンのオプションをdropzone.jsファイルを変更していたが、私はdropzone.jsライブラリファイルをリセットmyDropzone.jsファイルにオプションを設定することに決めました。オプションはdropzone.jsでファイルを設定した

、私はエラーがなかったが、私はmyDropzone.jsでそれらをこれらをリセットし、セットアップ後、私は私が信じていますこのエラーは、持っていましたオプションは初期化されていません in myDropzone.js

実際に、#submit-allボタンをクリックすると、init()関数が正しく機能します。

どうすれば問題を解決できますか?それを削除して

Uncaught Error: No URL provided.


さて、私は解決しました。今

私が提出したときに、私は次のエラーを取得する:のinit()関数で

Uncaught TypeError: myDropzone.processQueue is not a function

編集:

PDFが正常にアップロードされていないまで、私は、processQueue機能を削除し、私のアップロードページの検証ボタンをブロックすることにより、直前のエラーを解決しました。 私はそれが醜いハックであることを知っていますが、私はそれを行う別の方法を理解していませんでした。

+0

「キャッチされていないエラー:URLが提供されていません」 - このエラーが発生しているコード行はありますか? –

+0

dropzone.jsの440行目で、次のようになります: 'if(!this.options.url){ throw new error(" URLが指定されていません。 } ' これは、dropzone.jsライブラリの' function Dropzone(element、options) '関数内にあります。 ** dropzone.js **の前に** myDropzone.js **をインポートする必要がありますか? –

+0

これらの2つのファイルの順番を逆にしてはいけません - あなたは確かに 'options.url'を設定していないようですので、そのエラーが発生する理由があります –

答えて

0

私は3つのことを考えています: あなたの主なdropzone要素(あなたがDROPする場所)は#pdfFormです そしてあなたは#pdfFilesでプレビューします。それは言った:

1)コードがDropzone.options.pdfFormでなければならないDropzone.options.pdfFile

2)Dropzone.options.pdfFormが自動検出)がtrue(デフォルトにしましょうされて右構文は次のとおりです。TOUがf​​alseに自動検出したい場合しかし、あなたは試してみてください:
var myDropzone = new Dropzone("#pdfForm", { url: "form_threatment.php", other options... // JS : Dropzone classまたは $("#pdfForm").dropzone({ url: "form_threatment.php", other options... // JS : jquery style

3)あなたはJSで「form_threatment.php」を指定した場合、あなたはHTMLでそれを行う必要はありません。 Why is my dropzone javascript form not working?

+0

既にこのすべてを行っていますが、問題は解決しませんでした。私は瞬間のために醜い仕事を笑って考え出した。 –

0

しないでください。そして、あなたが自動検出=真(defalut)を使用することにした場合

もjQueryのバージョン3で問題が発生する可能性がために私の他の回答を参照してくださいフォームからアクション=「form_threatment.php」を削除することができますすべての提案を試みた後jqueryの$(document).ready(function(){ });

+0

なぜ私の問題を解決できますか? 'ready()'イベントでこれをラップすることは禁じられていますか? –

0

の内側にあなたのドロップゾーンのコードを入れて、私は実際にこれが私のtreatment_form.phpに醜い回避策やって解く:私は

2回threatment:

  1. PDFを受信すると、すべてが正常であることを確認して、サーバーにアップロードします。
  2. ユーザーがフォームを送信すると、フォームの残りの情報を確認し、PDFがアップロードされたことを知っていることを脅かします。
関連する問題