How to make ratings read only

Discussion
1

Is there a way to make ratings read only? At present on mouseover the rating changes but I'd like it to be read only.

Thanks

2

I don't believe there is a way to do this currently AFAIK. Maybe a Feature Request?

3

Hey @DavidS!

Just to be sure, have you toggled the "Editable column" setting off?

Are you referring particularly to the empty stars that are displayed with a rating?

If so, you might try the following custom CSS to remove it:

[aria-disabled="true"] ._d4YMI:not(._2yN1j) svg{
  display: none;
}

4

Hi @ScottR I think you're right, I'll add one

@Kabirdas In tables it works as expcted: I can set it to non editable and then moving the mouse over the stars doesn't cause the stars to highlight / unhighlight. However I'd like to do this using the standalone rating component outside of a table, which doesn't have a read only mode. Is ther a CSS trick to achieve this?

Jan-06-2023 11-31-49

5

Ahh I see, in that case, you might try setting "Disabled" to true and then using the following CSS to disable the greyscale filter:

._retool-rating1 ._sTeHJ{
  filter: none;
}

Does that work?

The CSS solution should only be a temporary one! We can let you know here when a built-in read only mode is supported for the rating component :slightly_smiling_face: