I need to prevent someone from deleting a file. The field is readonly, but I still can delete it.
I have a few situations like that, where I want something to happen on a form when it is in a specific stage, but not in others.
Something like this might work for your needs:
Add a custom HTML element to your form body. Give it a CSS Class name of getCurrentStepName. In the body of the element, add this and nothing else:
{/_current_step_name}
That custom HTML element will automatically be updated every time the form is loaded with the name of the current task/step. Now we can reference that via Javascript.
Use this CSS in order to hide that custom HTML element from view and add a class that we can use to hide the delete function later:
.getCurrentStepName {display: none!important;}
.hideOption {display: none!important;}
Then you can do some Javascript like this to check for a specific task name, and apply the CSS class at that time. If the current task/step is named anything other than the expected value (TEST in this example) then the class isn't applied.
$(document).ready(function () {
//If the current step name is "TEST" then loop through
//all file upload fields on the form and apply CSS to
//hide the delete options.
if($('.getCurrentStepName').text() == 'TEST') {
$('.files .delCell .file-del').each(function() {
$(this).addClass('hideOption');
});
}
});
Please note that I haven't actually tested this on a form, but it should work, I've done pretty similar stuff a lot of different times.
Hi Cris Dorrigoni De Morais,
I can't reproduce the issue in Forms 10.4.5.331 and 11.0.2212.30987. I created two forms A and B, then added an upload field in form A, and used this variable in form B and set it to readonly.
The result is that I cannot delete the file which I uploaded in form A.
Could you please provide more information such as version, screenshots for the configuration, video to illustrate the issue?
Hi Chuanhui Dai. I did a copy and worked, but all maintaince will require double of work. I would prefer maintain only one form. Is there any javascrip code that I can apply? The css will not work because I have a if-clausule to determine when the file is read-only. Version 10.4
I think there might be some issues with your javascript. Can you report a support case with attached business process? So we can get more details about it.
Your selected topics include "Version 10".
I can't find anywhere specifically in the release notes saying that something about this was changed, but I feel like version 11 doesn't do this. Have you considered upgrading to the latest version?
That would probably be the best solution.
But if you can't do that, it should be possible to hide the delete option via CSS. Something like this may work (assuming the structure hasn't changed a lot since version 10, I'm not certain, I did confirm this worked on the Classic Designer on version 11):
.files .delCell .file-del {display:none;}
Thanks. It worked, but I need it dynamic. Only when a IF-CLAUSE is yes, this X button should be hidden.
I have a few situations like that, where I want something to happen on a form when it is in a specific stage, but not in others.
Something like this might work for your needs:
Add a custom HTML element to your form body. Give it a CSS Class name of getCurrentStepName. In the body of the element, add this and nothing else:
{/_current_step_name}
That custom HTML element will automatically be updated every time the form is loaded with the name of the current task/step. Now we can reference that via Javascript.
Use this CSS in order to hide that custom HTML element from view and add a class that we can use to hide the delete function later:
.getCurrentStepName {display: none!important;}
.hideOption {display: none!important;}
Then you can do some Javascript like this to check for a specific task name, and apply the CSS class at that time. If the current task/step is named anything other than the expected value (TEST in this example) then the class isn't applied.
$(document).ready(function () {
//If the current step name is "TEST" then loop through
//all file upload fields on the form and apply CSS to
//hide the delete options.
if($('.getCurrentStepName').text() == 'TEST') {
$('.files .delCell .file-del').each(function() {
$(this).addClass('hideOption');
});
}
});
Please note that I haven't actually tested this on a form, but it should work, I've done pretty similar stuff a lot of different times.
Hi Matthew Tingey. This solution worked :)
I didn't try a combination between CSS and JS. Thank you so much!
I’m so happy it worked for you!