Good Day,
I have very limited knowledge on saving and retrieving images so I am struggling with this so I hope you can assist me. I am struggling to achieve the following steps…
What I want to do:
Kindly see a example of this…
Kind Regards
Hello,
Which part are you struggling with? There are multiple tasks here and it would help to break it down into smaller tasks and focus on them one by one.
Mark
Good Day @mark-piller
My apologies for the delayed reply. So yes I need help with the whole lot. The photos will be linked to vehicle’s invoice profile, the user will be able to create or update a new invoice. I have added some basic steps below that I would like to do.
Create Invoice
If the delete button is clicked then the photo must be deleted from the file.
Update Invoice
I would like guidance on if I should create a file in backedless for each invoice created with photos, if yes what would the logic be for this? If no then how will i group or link photos for each invoice.
Kind Regards
Donovan
Hello, @Donovan_Hardwick.
First of all, I would like to know, have you read our course on YouTube?
We also have documentation.
These resources will answer most of your questions.
YouTube Backendless
Docs Backendless
Best Regards, Nikita.
Let’s break it down:
Create Invoice
Use the File Uploader Button:
The component shows above does it automatically:
When a picture is uploaded, the following event handler is called. In that event handler you add the logic to link the uploaded file with an invoice.
What is photo component?
Perhaps this documentation might be helpful: Repeaters - Backendless UI Builder Developer Guide
If the delete button is clicked then the photo must be deleted from the file.
Here is the block that deletes a file:
Hope this helps.
Mark
Thank you @mark-piller
I have added the following details to the File Uploader button.
When trying to upload a file I receive the following error:
But my images/jobcards file is empty and remains empty ofter the error accrues.
When trying to upload a completely different image I get the following errors:
The second fault is related to resetting the file uploader on the “upload failure” logic, it is strange to me because when the first upload failed the button reset as expected but when uploading the second image the fault appears.
With regards to the expanding of the image and deleting I have done the following logic, unfortunately I am unable to test to see if the logic works…
Expand image - I have added a second image component (Full width) outside the repeating table and then use the following logic to set “fullViewPhoto” into Source URL Logic of the second image component.
Delete image/file - I am using the following logic to delete the file when the delete button is clicked.
Kind Regards
Donovan
Let’s focus on one problem at a time starting with the image upload.
Could you create a page that contains just file uploader button and see if we can get it working?
Application ID: 56447795-182A-D679-FF9E-05029343F800
Page: testPage
Email: demo@demo.com
Password: 12345
Hi Donovan,
When I launch testPage in the preview mode, I get infinite spinner and nothing happens:
Please provide more detailed steps to reproduce the issue.
Regards,
Mark
There is an error on the page when it loads. The error prevents some initialization logic to run, you need to look into it:
I made a copy of testPage and called it testPageMark. I fixed the logic in my page in two places:
OnUploadSuccess - added a check to make sure the data model list exists - this is what you already do in the page initialization, but since it doesn’t run (for the reason described above), I added a workaround which you will need to remove:
Added Source Logic for the image in the repeater - the data binding you had in there is wrong:
Here’s the result of running the page and uploading images:
Regards,
Mark
Hi @mark-piller
Thank you for the assistance.
While testing the logic I keep running into the following error.
As you the know none of the photos is saved to files with our current logic, but with that being said the destination file “images/jobcards” is currently empty. The logic works if its the first time I upload the image but if I refresh the page and try it again the same image it gives me the above error. What am I missing??
Kind Regards
Donovan
Did you read the error message? I think it is quite self-explanatory:
When you upload a file that already exists on the server, the server returns that error.
You can override that setting with the following configuration of the File Uploader Button component:
Hi @mark-piller
Thank you for your assistance. I did read the error message a couple times over but did not know that the “Overwrite Files” checkbox would fix the error.
My last question is what would be the best way to link the photos to the invoice in a database? I think the best way would be to save the links into the “photos” column in the “invoices” table, but I am not sure how to do this or if there is a better way to link photos to data to easily be retrieved later on.
Kind Regards
Donovan
The steps to do this are:
photos column in an Invoice objectInvoice object back into the database.Regards,
Mark
Hi @mark-piller
I can understand this working for only one photo/url but what if multiple photos/urls are saved?
I have used the type ‘File Reference’ as this is the only option the links to a url, however as far as I can see it is only links to one item.
Kind Regards
Donovan
If you need to associate a single database record with multiple files, I recommend using the JSON column type. In that case, you store a JSON array that would contain individual file URLs.
Regards,
Mark
Thank you @mark-piller
Do you have any documentation on using JSON in Backendless, as I have very limited knowledge of JSON.
Kind Regards
Donovan
If you have very limited knowledge of JSON, don’t jump into our documentation first. Study JSON from the materials that focus on JSON alone. After that, here’s the Backendless documentation:
https://backendless.com/docs/rest/data_json_overview.html
Regards,
Mark