Image questions

  

Hi,

I have a few questions on using images. I read a lot of posts and looked at the documentation but sadly it is not all that clear - to me that is. 

1 I want to show the image (u99) runtime if there is no image in the attribute (as default). 

2 I want to upload a file ans store that in the db on save action in the form (if a file is chosen)


Q:

-The default u99 file is not shown, why?

-Why do I have to use FileName ? It ought to be stored in the db.

-How do I save the chosen file in an action?


Regards, Harry



question:

-How do I save the chosen file in an action? 

has to be:

-How do I save the chosen file in the save action of the form (that also contains other attributes)?


so no extra (popup) screen is needed.


Harry

Hi, here are some insights.

- You can use this default image as Static, adding the image to the Images folder in the Interface of your Service Studio. And in your WebSecreen, put an IF to show this image only if there is not an image in the DB.

- The filename property is going to be assembled in the HTML tag.

- To save the file, you have to use the upload component, or any other upload files component in the Forge, like this one: https://www.outsystems.com/forge/component/593/dropzone-file-upload/. You will need to create a Binary column in a table in order to store the file contents.


You can use the following material as reference:

https://www.outsystems.com/help/servicestudio/9.0/Miscellaneous/Displaying_images/Using_Database_Images.htm

https://www.outsystems.com/forums/discussion/9392/upload-images/

https://www.outsystems.com/forums/discussion/16562/adding-database-images-to-an-entity/


Let us know if this could help you anyway.

Hi,

1 - The default u99 should show.

2 - You don't really need a filename u can use a text string like "Example"

3 - You need to get the information from the Upload widget and save them as the other fields.

Regards,

Marcelo


Hi,


I'm nearly there. However I get the warning

Ignored Upload Content : The method should be set to 'Submit' so that Upload widgets work properly in the 'Save' Screen Action.

Changing it would cause another warning:

Ignored Ajax Refresh
The method should be set to 'Ajax' so that Ajax Refresh elements of the 'Save' Screen Action aren't ignored.

Is there a workaround for it or do I have to use an extra screen (less nice).

Regards, Harry

If you're using the out of the box component, it's necessary to use Submit to send binary content to server.

The other way is using other file upload components in the Forge, just like the one I mentioned.

Hi Joao,

I want to use the DropZone component and I think you are the producer. When trying it out on your testwebsite it never uploads a file (jpg nor txt). It always shows an error on jpg and on txt it gives a warning that the file could not be uploaded to the db. 

On hovering it says Files are invalid, but it is a normal jpg

Regards, Harry  


Take a look at the Sample application. There is a couple of configurations you need to do in order to make the file type accepted.

https://www.outsystems.com/forge/component/2388/dropzone-sample/

Hi,

I took a little different approach

1) a button which points to RichWidgets\Popup_Upload

2) a RichWidgets\Popup_Editor which points to (LinkOrButtonId) to the button id

3) a RichWidgets\Popup_Editor onNotify action with an Popup_Upload_GetFile in it with Id: TextToInteger(NotifyGetMessage())

4) an assignement in the Notify action :

GetMedewerkerById.List.Current.Medewerker.Foto = Popup_Upload_GetFile.File.UploadedFile.Content

No errors or warnings now in the Service Studio. In use the popup opens, I can choose a file but it the Medewerker.Foto attribute contains no data. What am I missing?

Regards, Harry

  

.




Hi,

Can you share an espace? Would be easier to understand what are you doing.

Regards,

Marcelo

Hi

attached the OML. The screen is : Medewerker_Detail screen

Regards, Harry


Solution

Hello Harry, 

Your approach is not working because you are storing the image binary content in the aggregate, but is using the form.record to save to database.

Just change the assign in the NaUpload to store the content in the Form.Record instead.

Notice that you have a cache of one week. This means that after the first image is uploaded, a change will be seen a week later only.

Cheers.
Eduardo Jauch

EDIT:

It is better practice to store binaries and large size fields in "separated" entities (can be an extension entity, for example).

Solution

Hi again.

A small thing, because probably you will ask ;) rs

You should add a "DateTime" field to the picture entity, and every time you upload a new picture, you should update this field with CurrDateTime().

Why? Because than, you can use the FileName property to guarantee that if the user changes the picture, it invalidates the cache for that picture.

You can give the image a FileName like "Image_" + DateTimeValue

Be careful to replace any "invalid" characters (anything different than 0 to 9) in DateTimeValue by "" or "_".

This will cause the browser to actually pic the new picture, because the file name will change, but keep using the cache after the upload, every time you load the picture without a new upload saved.

Cheers,
Eduardo Jauch

Eduardo

Thank you. Got it working now. Also thanks for your tips about the datetime addition.

Regards, Harry