I've been banging my head on this for hours so hopefully someone can help. I'm trying to fetch either the row id or the form id when a file is uploaded into a dropzone box. I have multiple table rows with multiple dropzone boxes.

Here is an example row from my table:

<table class="docs" id="show">      
    <tr class="doc" id="*Need_This*">
        <td>
            <div class="file_upload drop">
                <form class="dropzone clickable" id="*Or_Need_This*">
                </form>
            </div>
        </td>
    </tr>
</table>

Here is my jquery:

<script type="text/javascript">
$(document).ready(function(){
     $(".dropzone").dropzone({ 
        paramName: 'photos',
        url: "post.php",
        dictDefaultMessage: "Drag or Click",
        clickable: true,
        enqueueForUpload: true,
        init: function() {
            var id = $(this).closest('tr').attr('id');
            this.on("success", function(file) { alert(id); });
          }
    });
});
</script>

Right now it's returning undefined. I need to get the id's so that I can append css changes to other elements on the row. Any help is greatly appreciated!

I've been banging my head on this for hours so hopefully someone can help. I'm trying to fetch either the row id or the form id when a file is uploaded into a dropzone box. I have multiple table rows with multiple dropzone boxes.

Here is an example row from my table:

<table class="docs" id="show">      
    <tr class="doc" id="*Need_This*">
        <td>
            <div class="file_upload drop">
                <form class="dropzone clickable" id="*Or_Need_This*">
                </form>
            </div>
        </td>
    </tr>
</table>

Here is my jquery:

<script type="text/javascript">
$(document).ready(function(){
     $(".dropzone").dropzone({ 
        paramName: 'photos',
        url: "post.php",
        dictDefaultMessage: "Drag or Click",
        clickable: true,
        enqueueForUpload: true,
        init: function() {
            var id = $(this).closest('tr').attr('id');
            this.on("success", function(file) { alert(id); });
          }
    });
});
</script>

Right now it's returning undefined. I need to get the id's so that I can append css changes to other elements on the row. Any help is greatly appreciated!

• javascript
• jquery
• jquery-plugins
• dropzone.js

2 Answers 2

this in your case refers to the Dropzone instance, not the element itself! If you need to access the actual element of your dropzone, use dropzone.element.

So you can do: var id = $(this.element).etc....

Hope that helped.

In the documentation you can read :

Gets the server response as second argument

Try with this :

this.on("success", function(file,rep) {
     alert(file);
     alert(rep); //The response
});