Grey out one button until condition is met

[MattLB]

Can you grey out a button (not a button bar) until a condition is met (such as entering text into a field)?

Not sure what new UI features have been implemented in the last few months. This is an App not a Page.

Right now I use visibility but it is kinda weird to have the button appear/disappear

Thanks as always

[Uzo]

In Apps is very easy… use the custom action for your button and put the condition there… button will be greyed out and unclickable until the condition is met.

[MattLB]

That is how I am implementing it and this works with a button bar bit not with a single button.

With a single button when the condition is met (note field is not empty) the button is ‘unhidden’ and is now visible. When the note field is empty the button is hidden/invisible.

Instead of hidden, I hoped for a greyed out single button.

[Uzo]

oh… ok, then your only option will be to use CSS to change the opacity of the button when the condition is not met:

<pre><span><style>

div[id*='screenScrollView'] > div > :nth-child(1) {
opacity:0.3 !important;
pointer-events: none !important}

Change child() to your button position

[Jeff_Hager]

Add two button. One that does what you want, and one that does mostly nothing (such as showing a notification). Change the button style on the second button, so it looks greyed out. Then you just need to set a visibility condition so the main button only displays when the condition is met, and the second button only displays when the condition is not met.

Or, you can just use one button, but set an else condition in the custom action to display a notification if the condition is not met. With this method you just won’t have a button that appears greyed out. Personally I’d go with the two button method.

[MattLB]

So I turned the second button into a ‘Hint’. Works better than a magically appearing button. Thanks for the tip.