UI Design for a ratings use case

siddharths over 7 years ago

Need a ratings capture screen - 1-5 stars.
On hover over a star, the color should change for the stars. For ex, if he is on the 3 start, color of 1-3 should change.
On click of the particular star, rating should get saved in the table. For example when I select rating 4, 4 stars should change color and rating 4 should get saved to the table.

Not sure if Hover over is possible. All creative ideas welcome.

Ex: callmenick.com/.../

Discussion posts and replies are publicly visible

Parents

0 Rajasekhar Pamidipati
A Score Level 2
over 7 years ago

Hi

I think it is not possible to achive mouse hover, but you can do it by onclick. use a!dynamicLink()
in a!documentImage() to save the value of selected star value in to some rule input or local variable.
if that rule input or local variable is not null then display different colors of stars based on the selected value.
Here you need to use two different colors of stars

a!imageField(
image:{
applycomponent(
a!documentImage(
Document: /*red or wight based on codition*/,
link: a!dynamicLink(
value: _
saveInto: local!selectedStar
)
),
enumerate(5)+1
)
}
)
Cancel
Vote Up 0 Vote Down

Sign in to reply

Verify Answer

Cancel

Reply

0 Rajasekhar Pamidipati
A Score Level 2
over 7 years ago

Hi

I think it is not possible to achive mouse hover, but you can do it by onclick. use a!dynamicLink()
in a!documentImage() to save the value of selected star value in to some rule input or local variable.
if that rule input or local variable is not null then display different colors of stars based on the selected value.
Here you need to use two different colors of stars

a!imageField(
image:{
applycomponent(
a!documentImage(
Document: /*red or wight based on codition*/,
link: a!dynamicLink(
value: _
saveInto: local!selectedStar
)
),
enumerate(5)+1
)
}
)
Cancel
Vote Up 0 Vote Down

Sign in to reply

Verify Answer

Cancel

Children

No Data