We've decided to change the products and articles voting system. Now you can vote only with yes or no:
Few words how it works: when user view page it has two pictures for voting (for yes and no), both are grey and he can vote by clicking on some of them. If he vote yes (clicking on yes picture) it becomes green and everytime he open the page, he'll see the green image, and the both picture won't be enabled for voting.
in this article we'll describe all issues when creating such control:
0. created neccessary db tables.
We have a table when save all votes:
...
CREATE TABLE [DB_CHEME].[Ratings](
...
[HostAddress] [nvarchar](20) NOT NULL,
[Vote] [bit] NOT NULL,
...
)
it's important to have HostAddress (the IP) of the user (next time he visits the page, you'll be able to check if he has already pass a vote),
Vote is bit (true or false), it's his vote.
1. create user control (ascx) and add this code there:
<asp:ImageButton ID="_yesBtn" runat="server" onclick="_yesBtn_Click" CausesValidation="false" /> <asp:Label ID="_yesLbl" runat="server"></asp:Label> <asp:ImageButton
ID="_noBtn" runat="server" onclick="_noBtn_Click" CausesValidation="false" /> <asp:Label ID="_noLbl" runat="server"></asp:Label>
2. code behind class:
private const string _none_yes = "grey_y.gif"; // picture for yes (before user vote)
private const string _none_no = "grey_n.gif"; // picture for no (before user vote)
private const string _no = "no.gif"; // picture for no, after user vote no
private const string _yes = "yes.gif"; // picture for yes, after user vote yes
private string _images_path = "../images/yn/"; // path for the necessary pictures
#region Events
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
//TODO Add code here to check if the current user has already voted.
if (didntVote)
{
FillNone(); // you can see this function below
}
else if (votedYes)
{
FillYes(); // // you can see this function below
}
else
{
FillNo(); // // you can see this function below
}
}
protected void _yesBtn_Click(object sender, ImageClickEventArgs e)
{
//TODO: register new vote for yes
FillYes();
}
protected void _noBtn_Click(object sender, ImageClickEventArgs e)
{
//TODO: register new vote for no
FillNo();
}
#endregion
#region Private Methods
private void FillNone()
{
_yesBtn.ImageUrl = _images_path + _none_yes;
_noBtn.ImageUrl = _images_path + _none_no;
_yesBtn.Attributes.Add("onmouseover", "src='" + _images_path + _yes + "' ");
_yesBtn.Attributes.Add("onmouseout", "src='" + _images_path + _none_yes + "' ");
_yesBtn.AlternateText = "it's cool!";
_noBtn.AlternateText = "it's NO cool!";
_noBtn.Attributes.Add("onmouseover", "src='" + _images_path + _no + "' ");
_noBtn.Attributes.Add("onmouseout", "src='" + _images_path + _none_no + "' ");
}
private void FillYes()
{
_yesBtn.ImageUrl = _images_path + _yes;
_yesBtn.Enabled = false;
_noBtn.ImageUrl = _images_path + _none_no;
_noBtn.Enabled = false;
}
}
#endregion
That's All, I hope this article'll be useful to someone else too :)
Hi. Good site.
