Javascript library for file uploads.
Javascript library for file uploads. Features include
- Multiple File Sources
- Multiple Input Formats
- Async or Sync Uploading
- Responsive
- Accessable
- Automatic Resizing
Resources
Questions tagged [filepond]
383 questions
9
votes
1 answer
How to increase dimensions of filepond drop area in React.js?
I have a FilePond component used to upload files in my React App with the following implementation :
~~~React.js
render() {
return (
//Pass FilePond properties as attributes
Volck
- 334
- 6
- 14
7
votes
1 answer
Can I get FilePond to show previews of loaded local images?
I use FilePond to show previously uploaded images with the load functionality. The files are visible, however I don't get a preview (which I get when uploading a file).
Should it be possible to show previews for files through load?
files: [{
…
Paul
- 336
- 1
- 3
- 11
5
votes
1 answer
Filepond customize droparea
Using filepond I need to customize the filepond droparea, meaning that I need to add some custom HTML with some placeholder images to give an idea to the user about what kind of images should be uploaded and should allow multiple uploads.
Is there…
fefe
- 8,755
- 27
- 104
- 180
5
votes
1 answer
FilePond only pdf accepted files
I am using FilePond (React) in order to upload files. I want only pdf files.
I've installed the File Type Validation plugin with npm command : npm i filepond-plugin-file-validate-type --save and then npm run-script build command. I've tested and…
ana maria
- 353
- 1
- 4
- 22
5
votes
2 answers
How to convert any image to webp?
Any way to convert any image to webp with filepond?
This is my code:
import vueFilePond, { setOptions } from 'vue-filepond'
// ...
setOptions({
server: {
process: (field, file) => {
file.name = String(file.name.substr(0,…
Rimuru Tempest
- 153
- 1
- 2
- 7
5
votes
6 answers
How to delete a file on the server? FilePond.revert does not pass parameters to the laravel controller
FilePond.revert does not transfer unique id files to the laravel controller.
How to delete the downloaded file by ID?
FilePond JS
var csrf = $('meta[name="csrf-token"]').attr('content');
FilePond.setOptions({
server: {
…
Юрий Калнин
- 51
- 1
- 2
5
votes
1 answer
How to fix "Uncaught reference error : FilePond is not defined" in FilePond drag and drop
I am trying to use FilePond to implement drag and drop functionality on my website. I have downloaded the filepond css and js files and attatched them correctly. I keep getting an "Uncaught reference error : FilePond is not defined" whenever I try…
Opp
- 520
- 1
- 8
- 21
5
votes
2 answers
Get data from filepond object instance
I have a submit form in my React project, where I'm using the filepond API, so users can submit files to the form
I'm just using the standard FilePond component taken from the documentation so far.
this.pond = ref}
…
Kristoffer Tølbøll
- 3,157
- 5
- 34
- 69
4
votes
1 answer
How to revert process file in FilePond JS?
I started using Filepond JS and I am confused about how to call certain functions. Perhaps it is because my knowledge of ES6 is not that good, or maybe I am just overthinking this whole problem. The process uploads a file to a tmp folder. On the…
Irvin
- 51
- 5
4
votes
1 answer
How to use FilePond in Django project
Background:
I have two models: SellingItem and SellingItemImages. SellingItemImages has a custom FileField that can take multiple files. By putting two forms(itemform and imageform) under single element (enctype="multipart/form-data"), I was able…
ha-neul
- 3,058
- 9
- 24
4
votes
4 answers
Reset FilePond Input in Javascript
I have implemented Filepond uploaded in my page. When the user selects a file, I set that file on a html canvas for edits. However when the user wants to upload another file, filepond input retains last uploaded file.
I have tried…
user9020594
- 95
- 1
- 7
3
votes
0 answers
FilePond not loaded initial image from server - Cors issue
I already have an image I uploaded before. When the user enters the page, I want to show this image as a preview, but I have a problem while fetching it from the server.
It's work when I use https://picsum.photos/200/300 instead of 'source' (my…
Ugur
- 750
- 9
- 20
3
votes
0 answers
Filepond file upload required status not working
filepond plugin required status not working
Supun Madhushanka
- 149
- 8
3
votes
2 answers
How can I access a class component method in a function component?
I'm trying to access a class component method inside a function component. I have been reading for hours but I'm missing something.
To be precise, I'm trying to access a method (addFiles) of the Filepond component…
Jacin
- 71
- 9
3
votes
3 answers
How can I make the selected file type acceptable only as docx, using FilePond?
How can I make the selected file type acceptable only as docx?
I want the selected file to have a docx extension only. What kind of filtering should I apply? How can I do that?
React code sample
return (
<>
meren
- 432
- 5
- 19