Grayed out inactive button

Grayed out inactive button

  
Hi,

I need to add a button on a web screen that must be shown as "active" or "inactive", depending on the permissions of the user. I have the active button, the inactive button should be grayed out. I assume I can add a new style for the grayed out button in the style sheet? Does someone have an example of this?
Thanks,
Annemarie
Hi Annemarie,

Did you try using the Enabled property of buttons in service studio? In IE buttons show up as "grayed out" if you set this property to False.

Hope it helps!

Gonçalo
Gonçalo,

Thanks, I think this is just what I need. How about Firefox, does it gray out as well, or is the button only inactive?

Thanks,
Annemarie
Hi again Annemarie,

In my tests Firefox 1.5 only disables the button but with no visual style applied. Would this be a limitation in your particular situation?

If so, you can always play around with the CSS class for that button - maybe setting the font color to grey would suffice?
Cheers,
Gonçalo
Gonçalo,

Maybe not, I have to check that with the customer.

Thanks,
Annemarie
Hi,

By default, Firefox doesn't gray out inactive links and buttons like IE does. Add the following to your CSS stylesheet to make IE and Firefox render links and buttons the same way:

input {
padding: 1px 0px 1px 0px;
}

input[disabled=true] {
background: ButtonFace;
cursor: text;
}

a[disabled=true] {
color: ButtonShadow;
}

.Button {
text-align: center;
margin-right: 3px;
padding: 0px 10px 1px 10px;
*padding: 0px 3px 0px 3px;
}

.Button[disabled=true] {
padding: 1px 12px 2px 10px;
color: ButtonShadow;
cursor: text;
}

This is already included in the default stylesheet of Service Studio since version 4.0.1.28.

Note: this was tested under Standards Rendering Mode in IE6, IE7 and Firefox 2.0.

Best regards,
Gustavo Guerra