Question

I’m creating an app that will have a list of messages, each message can be either read or unread. Think GMAIL (though I’m not trying to rebuild that)…

My question is when I output all these messages, I need to list if the message is read or unread, I also need to provide the ability to change the message status, from read to unread. That being said, how do you suggest I stored this? A checkbox, a hidden input value? Any thoughts?

Thanks

Answer 1

A checkbox could be a simple way to show whether or not the message is read, but I think that styling differences between the message headers (or whatever you’re displaying on this page) would make for a better UI.

You could store a “message-type” associated with each message, that gets used to set a class when the page is built. When you toggle its status between read and unread, the styling will flip according to the rules you set for that status.

eg)

.unread{
 background-color:#DDDDDD;
 font-weight:bold;
}
.read{
 background-color:#FFFFFF;
 font-weight:normal;
}