I am trying to create a Like and dislike counter for my webpage (similar to facebook like button). I am using WebMatrix Razor syntax and SQL CE database.
Below is my code which works fine, I want you expert's to take a look at code and please let me know if this is the correct way of doing it.
I have one page which displays data and the Like /DisLike buttons. I have 2 server pages. When user clicks on 'Like' button it calls the Like.cshtml server page and when user clicks on 'Dislike' button it calls the DisLike.cshtml page. Is this the right
way of doing it or a lengthy way, please suggest if there is a better option.
My code below
Defaul Page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
<script>
function CountLikes(str) {
var xmlhttp;
if (str == "") {
document.getElementById("txtHint").innerHTML = "";
return;
}
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "Likes.cshtml?ids=" + str, true);
xmlhttp.send();
}
</script>
<script>
function CountDisLikes(str) {
var xmlhttp;
if (str == "") {
document.getElementById("txtHint").innerHTML = "";
return;
}
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "DisLikes.cshtml?ids=" + str, true);
xmlhttp.send();
}
</script>
</head>
<body>
@{
var dbase = Database.Open("Rating");
var topic = dbase.Query("SELECT * FROM Rating ORDER BY ID");
}
<div>
@foreach (var row in topic)
{
<div style="border: 1px solid">
<b>Topic:</b>@row.topic
<br />
<b>Likes:</b>@row.CountLikes
<br />
<b>DisLikes:</b>@row.CountDisLikes
<br />
<button name="action" value="@row.ID" onclick="CountLikes(this.value)">Like</Button>
<button name="action" value="@row.ID" onclick="CountDisLikes(this.value)">DisLike</button>
<br /> <br />
</div>
}
</div>
</body>
</html>
Server Page Like.cshtml
@{
var TopicId="";
var CountLikes="";
if (!IsPost) {
if(!Request.QueryString["IDS"].IsEmpty()){
TopicId = Request.QueryString["IDS"];
var db=Database.Open("Rating");
var updateCommand="UPDATE Rating SET CountLikes=CountLikes + 1 where ID=@1";
db.Execute(updateCommand, CountLikes, TopicId);
}
}
}
Server Page DisLike.cshtml
@{
var TopicId="";
var CountDisLikes="";
if (!IsPost) {
if(!Request.QueryString["IDS"].IsEmpty()){
TopicId = Request.QueryString["IDS"];
var db=Database.Open("Rating");
var updateCommand="UPDATE Rating SET CountDisLikes=CountDisLikes + 1 where ID=@1";
db.Execute(updateCommand, CountDisLikes, TopicId);
}
}
}
The first link you posted, is the thread I created :-)
The reason I posted my codes here on this forum, is for some experience members to verify my code and find any errors. I am very new to this and learning web programming from various forums. So any working program I write I want to make sure it is correct
and error free.
Aafi
Member
32 Points
53 Posts
Like DisLike Counter using Ajax
Dec 29, 2012 09:34 AM|LINK
Hello All,
I am new to programming and Ajax and need help.
I am trying to create a Like and dislike counter for my webpage (similar to facebook like button). I am using WebMatrix Razor syntax and SQL CE database.
Below is my code which works fine, I want you expert's to take a look at code and please let me know if this is the correct way of doing it.
I have one page which displays data and the Like /DisLike buttons. I have 2 server pages. When user clicks on 'Like' button it calls the Like.cshtml server page and when user clicks on 'Dislike' button it calls the DisLike.cshtml page. Is this the right way of doing it or a lengthy way, please suggest if there is a better option.
My code below
Defaul Page
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title></title> <script> function CountLikes(str) { var xmlhttp; if (str == "") { document.getElementById("txtHint").innerHTML = ""; return; } if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function () { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { document.getElementById("txtHint").innerHTML = xmlhttp.responseText; } } xmlhttp.open("GET", "Likes.cshtml?ids=" + str, true); xmlhttp.send(); } </script> <script> function CountDisLikes(str) { var xmlhttp; if (str == "") { document.getElementById("txtHint").innerHTML = ""; return; } if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function () { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { document.getElementById("txtHint").innerHTML = xmlhttp.responseText; } } xmlhttp.open("GET", "DisLikes.cshtml?ids=" + str, true); xmlhttp.send(); } </script> </head> <body> @{ var dbase = Database.Open("Rating"); var topic = dbase.Query("SELECT * FROM Rating ORDER BY ID"); } <div> @foreach (var row in topic) { <div style="border: 1px solid"> <b>Topic:</b>@row.topic <br /> <b>Likes:</b>@row.CountLikes <br /> <b>DisLikes:</b>@row.CountDisLikes <br /> <button name="action" value="@row.ID" onclick="CountLikes(this.value)">Like</Button> <button name="action" value="@row.ID" onclick="CountDisLikes(this.value)">DisLike</button> <br /> <br /> </div> } </div> </body> </html>Server Page Like.cshtml
@{ var TopicId=""; var CountLikes=""; if (!IsPost) { if(!Request.QueryString["IDS"].IsEmpty()){ TopicId = Request.QueryString["IDS"]; var db=Database.Open("Rating"); var updateCommand="UPDATE Rating SET CountLikes=CountLikes + 1 where ID=@1"; db.Execute(updateCommand, CountLikes, TopicId); } } }Server Page DisLike.cshtml
@{ var TopicId=""; var CountDisLikes=""; if (!IsPost) { if(!Request.QueryString["IDS"].IsEmpty()){ TopicId = Request.QueryString["IDS"]; var db=Database.Open("Rating"); var updateCommand="UPDATE Rating SET CountDisLikes=CountDisLikes + 1 where ID=@1"; db.Execute(updateCommand, CountDisLikes, TopicId); } } }Song-Tian - ...
All-Star
43697 Points
4304 Posts
Microsoft
Re: Like DisLike Counter using Ajax
Dec 31, 2012 07:34 AM|LINK
Hi,
I suggest you using web service or page method to do that.
For webservcie, please refer to: http://msdn.microsoft.com/en-us/library/bb398995(v=VS.90).aspx.
And pagemethod, please refer to: http://blogs.microsoft.co.il/blogs/gilf/archive/2008/10/04/asp-net-ajax-pagemethods.aspx.
Feedback to us
Develop and promote your apps in Windows Store
Aafi
Member
32 Points
53 Posts
Re: Like DisLike Counter using Ajax
Dec 31, 2012 03:57 PM|LINK
Thank you for the reply,
I am using WebMatrix and Razor syntax. the above links explains using Web Service in ASP.Net pages, how do I use Web Service using Razor syntax
chetan.sarod...
All-Star
65749 Points
11148 Posts
Re: Like DisLike Counter using Ajax
Jan 01, 2013 08:42 AM|LINK
Refer this
http://forums.asp.net/t/1868759.aspx/1/10?Like+and+Dislike+counter+increment+value+in+SQL+database+
http://forums.asp.net/t/1780146.aspx/1
Senior Software Engineer,
Approva Systems Pvt Ltd, Pune, India.
Aafi
Member
32 Points
53 Posts
Re: Like DisLike Counter using Ajax
Jan 01, 2013 10:56 AM|LINK
Hi Chetan,
Thanks for the links.
The first link you posted, is the thread I created :-)
The reason I posted my codes here on this forum, is for some experience members to verify my code and find any errors. I am very new to this and learning web programming from various forums. So any working program I write I want to make sure it is correct and error free.