10
Views
7
Comments
[Dropzone Reactive] How to set DropZone Reactive properties for file upload from mobile gallery/ folders.
dropzone-reactive
Reactive icon
Forge asset by José Torrão
Application Type
Reactive
Service Studio Version
11.54.68 (Build 63464)
Platform Version
11.28.0 (Build 43201)


Hi Friends,

Hope everyone is doing great.

I need some help. 

I have a code where we are using the Dropzone reactive component to upload files. However, when using the application from a mobile device, clicking the component always opens the camera. I want the user to have the option to upload a photo or file from the gallery or local storage.

Could you please help me to configure the properties in the Dropzone reactive component to achieve this.

Thank you all in advance for your help in figuring this out.


Best Regards,

Md Sohel Khan

UserImage.jpg
Md Mansur

Hi @Md Sohel Khan


Dropzone Reactive (O11)  forge also provide demo Oml where you can see all configuration or how to used this forge component

I have attached demo Oml file or You can download Via Forge 

Thanks

Md Mansur


DropzoneReactiveExample.oml
2025-10-16 10-02-51
Sohel Khan

Hi @Md Mansur,

Thanks for your reply.

I have already installed the demo but that configuration it's not present there. I need to upload the local files/ photos from Mobile.

UserImage.jpg
Md Mansur

 Hi 

I have attached the Oml File go go throgh this:

Configurations Logic:

Point-1"

Create a Screen and In this Screen you can add a container and set the name of container and add css class Like this ( container name test and also dropzone is css class):


2. go to dependency and select ZoneDropdown Block Like this: and the flow drag on you screen

3.two prop is Mendetory like(widgetid = Test.id:

and For call Back you follow below Configration:

1. expose a Rest Api

2.add menthod

3.change Method HTTP (Get To Post)

4.add Local Record Same as a you Enetites Name

Logic:

1.Call GetRequestFile From  HTTPREquesthandle (Via Dependency)

2.Assign Value To your Local Record

3. Call create Crud Operation 

Note:

Than you Can set you CallBackURL Like this on Screen:

Substr(GetBookmarkableURL(),0,Index(GetBookmarkableURL(),"/FileUpload/")) + "/FileUpload/rest/Upload/RESTAPIMethod1"

How to make Link:

Substr(GetBookmarkableURL(),0,Index(GetBookmarkableURL(),"/Your Module Name/")) + "/Your Rest Api method URl"

Last Point:ZoneDropdown Block there a event called Oncomplete so call a cleint action and refresh the data 

working URL:

https://personal-bedrfblj.outsystemscloud.com/PreviewInDevices/?IsMobilePreview=True&DeviceName=Smartphone&URL=/FileUpload/Home?_ts=638581955629619292


Thanks

Md Mansur

FileUpload.oml
2025-10-16 10-02-51
Sohel Khan

Hi @Md Mansur 

Thanks for your reply and efforts.

But my question is different. I have already a component working in my application but when ever I tried to click the widget it takes me to my camera in my mobile , uploading from gallery or local file option is not available. I have checked your app it's too same behaviour. You can't upload local files from your mobile. 

UserImage.jpg
Md Mansur

I have attached scanner so you can scan and install app:


I have check on my Phone its working Fine:

Note : when you choose file its automatic upload file in Dataabse

Thanks

Md Mansur

2025-09-30 06-48-04
José Torrão

Hey Md Sohel Khan,

It might be specific to the phone you are using, which phone did you test this with?

Kind regards,
Jose

2025-10-16 10-02-51
Sohel Khan

Thanks for your reply but it's occurring for my both Android device.

Vivo , Samsung.

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.