How can I disable a button or an input field in ui builder

[hharrington]

For changing visibility I found the toggle component visibility block. I was not able to find a block to toggle (enable/disable) on a ui component.

I was looking at this post : Disable browser autofill on input? - #6 by mark-piller

so I placed the button in a block, added an anchor name then placed code in custom code block

var myInput = document.getElementById('import_sample_block').getElementsByTagName('import_sample_button')[0];
myInput.disabled = true;

so import_sample_block is the block anchor and import_sample_button is the button id.

this does not work, I hope I’m at least on the right track.

what’s the best way to enable/disable buttons/input boxes via codeless ?

thanks,
H

[mark-piller]

Hi @hharrington ,

Are you looking for something like this: ?
https://www.backendless.us/api/files/ui-builder/containers/support/index.html?page=enabledisable

Mark

[hharrington]

I want to do this with radio buttons IE click radio button and 1 regular button is enabled and 3 others are disabled. but yes thats what I need to do!

H

[mark-piller]

I will let you figure out the radio buttons logic… Enabling and disabling works like this:

1. Setup data binding:

   Button:
   

   Input:
   

2. Control the state through data binding - logic in the toggles:
   

   

Regards,
Mark

[hharrington]

Thanks that did the job!

[Tim_Jones]

@mark-piller Is there a more efficient way to enable/disable buttons? It seems like an extra step to create a property in page data for every button, and then toggle the button disabled state through the page data property instead of interacting with the button directly.

I was trying this as it seems more direct -

But I’m getting the error -

Uncaught (in promise) TypeError: Cannot set properties of undefined (setting 'disabled')

I don’t understand how the button is undefined when it is what the on click event is being triggered from.

Thanks,
Tim

[mark-piller]

The approach you tried, works for me:
https://www.backendless.us/api/files/ui-builder/containers/support/index.html?page=buttonstate

This is the Codeless logic:

I am not sure if that would be more efficient though.

[Tim_Jones]

Thanks, @mark-piller. I used your original suggestion.

Tim