Don't use JQ and file pond upload file
I'm facing an issue with FilePond while attempting to add files to the input field using jQuery. Here is my code:
var inputDesc = document.getElementById("inpImgDesc");
FilePond.create(inputDesc, {
allowMultiple: true,
labelIdle: 'Kéo & Thả hoặc Click để chọn tệp',
labelFileProcessing: 'Đang xử lý tệp...',
labelFileProcessingComplete: 'Xử lý hoàn tất',
acceptedFileTypes: ['image/*'],
imagePreviewMaxHeight: 300,
imagePreviewMaxWidth: 300,
});
And I've tried a few methods to add files to FilePond:
Method 1:
var pond = FilePond.find(document.getElementById('inpImgDesc'));
$.get("http://localhost:8080/photo?realEstateId=" + paramProject).then(function(photos){
photos.forEach(photo => {
var parts = photo.path.split('/');
var fileName = parts[parts.length - 1]
$.get("http://localhost:8080" + photo.path).then(function(response) {
var file = new File([response], fileName);
pond.addFile(file);
});
});
});
Method 2:
var pond = FilePond.find(document.getElementById('inpImgDesc'));
$.get("http://localhost:8080/photo?realEstateId=" + paramProject).then(function(photos){
photos.forEach(photo => {
const file = {
source: "C:/Users/PC/Desktop/realestate/src/main/resources/static" + photo.path,
options: {
type: 'local', // This is a local path
},
};
pond.addFile(file);
});
});
Method 3:
Copy code
$.get("http://localhost:8080/photo?realEstateId=" + paramProject).then(function(photos){
photos.forEach(photo => {
const file = {
source: photo.path,
options: {
type: 'local', // This is a local path
},
};
pond.addFile(file);
});
});
It here result $.get("http://localhost:8080/photo?realEstateId=" + paramProject)
[ { "id": 9, "path": "/images/Project/125/imgDesc/property-14.jpg" }, { "id": 10, "path": "/images/Project/125/imgDesc/property-17.jpg" }, { "id": 11, "path": "/images/Project/125/imgDesc/property-42.jpg" }, { "id": 12, "path": "/images/Project/125/imgDesc/property-44.jpg" }, { "id": 13, "path": "/images/Project/125/imgDesc/property-46.jpg" } ]
I did try test src=> src correct
enter image description here