vue-dropzone
vue-dropzone copied to clipboard
change remove link position
Can anyone let me know how can I change the remove link position? As u can see below I am having a custom delete button which I want to make behave like remove link.
<vue-dropzone
ref="FileDropzone"
id="dropzone"
@vdropzone-file-added="handleFileAdding"
:options="dropzoneOptions"
:useCustomSlot="true"
:duplicateCheck="true"
@vdropzone-removed-file="removedFile"
@vdropzone-complete-multiple="completeMultiple"
@vdropzone-success-multiple="successMultiple"
@vdropzone-sending-multiple="appendFormData"
:include-styling="false"
</vue-dropzone>
<div class="my-prevs">
<div class="d-grid grid-container" v-if="images.length>0">
<div class="grid-item" v-for="s in images" :key="s.name">
<img :src="s.fileSrc" class="img-fluid w-100" />
<div class="grid-footer p-2">
<div>Pages {{s.totalPages}}</div>
<a class="dz-remove" href="javascript:undefined;" data-dz-remove="">Remove file</a>
<div>
<button
type="button"
class="btn icon icon-delete text-primary p-0"
title="Delete"
></button>
</div>
</div>
</div>
</div>
</div>
@rowanwins could you please help in this???
Hi @KevangPatel
Sorry for the slow reply. Can you post a screenshot of what you're trying to achieve and why you can't achieve it with a custom template?
Thanks
The suggested approach in dropzonejs doco is to use something like
<img src="removebutton.png" alt="Click me to remove the file." data-dz-remove />
data-dz-remove is the critical part apparently so presumably you could swap out the img element for a button or whatever and then style accordingly with css.
Hope that helps