Skip to Content (Press Enter)
UserImage.jpg
Esrom Galang
645Views
6Comments
Solved
How to disable upload widget in reactive?
Question
Reactive
Application Type
Reactive

Hello,

Since the upload widget doesn't have a disable property, so I tried using Javascript.

document.getElementById($parameters.InputFileId).disabled = true;

But it isn't working. Do you have any solution to this?

Cheers!

0
0
08 Jan 2021
Copy Link
2021-03-18 21-03-15
Benjith Sam
 
MVP
Solution

Hi Esrom,

For the specified use-case, try with the below-mentioned JavaScript code.

  • Define a  JavaScript node with a single input parameter passing the Upload widget Id
  • Using the JavaScript disable the "file" type input which is defined inside the upload widget

JavaScript Snippet

var uploadWidget = document.querySelector('#' + $parameters.UploadWidgetId + ' > input');
uploadWidget.setAttribute("disabled", "disabled");


Hope this helps you!


Kind regards,

Benjith Sam

See solution in context
4
0
08 Jan 2021
Copy Link
UserImage.jpg
Esrom Galang

This works like magic. Thanks, Benjith!

0
0
08 Jan 2021
Copy Link
2021-03-18 21-03-15
Benjith Sam
 
MVP

Replying to Esrom Galang's comment on 08 Jan 2021 14:48:42

You're welcome, Esrom.

Glad to help you :)


Kind regards,

Benjith Sam

1
0
08 Jan 2021
Copy Link
2022-06-17 09-22-26
Huarlem Lima

Hi Esrom,

I suggest using this component for File Upload.

https://www.outsystems.com/forge/component-overview/7405/reactfilepondupload

3
0
08 Jan 2021
Copy Link
2021-03-18 21-03-15
Benjith Sam
 
MVP
Solution

Hi Esrom,

For the specified use-case, try with the below-mentioned JavaScript code.

  • Define a  JavaScript node with a single input parameter passing the Upload widget Id
  • Using the JavaScript disable the "file" type input which is defined inside the upload widget

JavaScript Snippet

var uploadWidget = document.querySelector('#' + $parameters.UploadWidgetId + ' > input');
uploadWidget.setAttribute("disabled", "disabled");


Hope this helps you!


Kind regards,

Benjith Sam

4
0
08 Jan 2021
Copy Link
UserImage.jpg
Esrom Galang

This works like magic. Thanks, Benjith!

0
0
08 Jan 2021
Copy Link
2021-03-18 21-03-15
Benjith Sam
 
MVP

Replying to Esrom Galang's comment on 08 Jan 2021 14:48:42

You're welcome, Esrom.

Glad to help you :)


Kind regards,

Benjith Sam

1
0
08 Jan 2021
Copy Link
UserImage.jpg
Sarah Javed

can any one provide me the oml

0
0
28 Apr 2022
Copy Link
2021-03-18 21-03-15
Benjith Sam
 
MVP

Hi Sarah,

Sure, refer to the attached oml file.

JS Snippet:

document.querySelector('#' + $parameters.FileUploadId + ' > input[type="file"]').disabled = true;

Demo screen: DisableUploadWidget

I hope this helps you!


Kind regards,

Benjith Sam

RWA_Lab_DisableUploadWidget.oml
1
0
28 Apr 2022
Copy Link
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.