dropzone-meteor howto fire events

我是Meteor新手，我想了解一些相關知識。因此，我想建立一個頁面，我可以通過meteor-dropzone上傳圖片。dropzone-meteor howto fire events

上傳與meteor-uploads一起使用。

現在我想要從dropzone獲取事件，如'addedfile'或'drop'以激發一些新功能。

HTML頁面Profile2中：

<template name="profile2">  
    <div class="ibox-content">         
     {{> dropzone url='http://localhost:3000/uploads' maxFilesize=5 addRemoveLinks=true acceptedFiles='image/*,jpg,jpeg,png' id='dropzoneDiv'}} 
    </div> 
</template name="profile2">

在js文件創建的Profile2我寫了這個：

Template.dropzone.events({ 
    'addedfile #dropzoneDiv': function(e, template){ 
     e.preventDefault(); 
     console.log("Hello"); 
    } 
});

但我沒有看到在輸出的console.log東西。

我確定我做錯了什麼。但我不知道問題或錯誤理解在哪裏。有人可以幫助我。

謝謝。邁克爾

來源

2016-07-06 Michael

嘗試和錯誤之後，我找到了解決辦法。也許有人可以解釋給我聽。因爲我不完全理解，爲什麼它的工作，但現在如此不同正常流星事件版本。

Dropzone.options.dropzoneDiv = { 
    init: function() { 
     this.on("addedfile", function(file) { alert("Added file."); }); 
    } 
};

這樣的模板：。

<!-- Page heading --> 
{{> pageHeading title='File upload' category='Forms' }} 

<div class="wrapper wrapper-content animated fadeIn"> 
    <div class="row"> 
     <div class="col-lg-12"> 
      <div class="ibox float-e-margins"> 
       <div class="ibox-title"> 
        <h5>Dropzone Area</h5> 
        {{>iboxTools}} 
       </div> 
       <div class="ibox-content"> 

        <!-- For more info about dropzone plugin see this: https://github.com/devonbarrett/meteor-dropzone/ --> 
        {{> dropzone url='/uploads' id='dropzoneDiv'}} 
       </div> 
      </div> 
     </div> 
    </div> 

</div> 
</template>

來源

2016-07-07 12:24:21 Michael

嘗試dropped事件：

'dropped #dropzoneDiv' (e, template) => { 
    e.preventDefault(); 
    console.log(e.originalEvent.dataTransfer.files); // this will contain the list of files that were dropped 
}

來源

2016-07-06 20:15:17

遺憾沒有變化 – Michael

嘗試將事件附加到你的'profile2'模板，而不是'dropzone'模板 –

對不起邁克爾這也不起作用。爲了測試我做了一個COM完成新的模板。我將添加完整的模板代碼。嘗試和錯誤後嘗試執行 – Michael

我的完整模板代碼：

<template name="profil2"> 

<!-- Page heading --> 
{{> pageHeading title='File upload' category='Forms' }} 

<div class="wrapper wrapper-content animated fadeIn"> 
    <div class="row"> 
     <div class="col-lg-12"> 
      <div class="ibox float-e-margins"> 
       <div class="ibox-title"> 
        <h5>Dropzone Area</h5> 
        {{>iboxTools}} 
       </div> 
       <div class="ibox-content"> 

        <!-- For more info about dropzone plugin see this: https://github.com/devonbarrett/meteor-dropzone/ --> 
        {{> dropzone url='/uploads' id='dropzoneDiv'}} 
       </div> 
      </div> 
     </div> 
    </div> 

</div> 
</template>

我的完整事件捕獲代碼：

Template.profil2.events({ 
    'dropped #dropzoneDiv': function(e,template){ 
     e.preventDefault(); 
     console.log("hurra"); 
     console.log(e.originalEvent.dataTransfer.files); // this will contain the list of files that were dropped 
    } 
});

這是全部的代碼，我有。 Dropzone正在上傳，文件存儲在服務器上。所以目前我不知道爲什麼事件不起作用。但我相信這是一個初學者的錯。 :(

來源

2016-07-07 10:32:26 Michael

。我找到了解決方案。 – Michael

dropzone-meteor howto fire events

回答

相關問題