lancyb 0 Newbie Poster

Hi,

Since I am a newBee in asp.net, I need the assistance from all of you who are experience in this field of ASP.NET.

I am creating a web page, where the user gives comment and star rating. The rating function is created in JavaScript.

Please note that I am not using Ajax Tool kit with rating control.

Problems:
1) Whatever value is generated by click of the star it should calculate 'average' in the javascript or VB and then save it should save to the database.

2) How average calculations are made? Need example step by step.

3) Where should I write the average calculation coding. (In VB or in JavaScript)

4) I don't need the title for the rating. If i remove, it throws an error.

5) The average value should be visible from database. (This concept is familiar in most of the web sites. For e.g: rating and article (x.xx/x from xx votes/comments))

Please note I am using Visual Studio 2008 (in asp.net with VB) as front end and sql server 2005 express edition as a back end.

Coding is enclosed below for immediate reference.

Default.aspx:

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
  <span id="rateStatus"></span>
   <span id="ratingSaved"></span>
    </div>
    <div id="rateMe" >
    <a onclick="rateIt(this)" id="_1" onmouseover="rating(this)" onmouseout="off(this)"></a>
    <a onclick="rateIt(this)" id="_2" onmouseover="rating(this)" onmouseout="off(this)"></a>
    <a onclick="rateIt(this)" id="_3" onmouseover="rating(this)" onmouseout="off(this)"></a>
    <a onclick="rateIt(this)" id="_4" onmouseover="rating(this)" onmouseout="off(this)"></a>
    <a onclick="rateIt(this)" id="_5" onmouseover="rating(this)" onmouseout="off(this)"></a>
</div>

<style type="text/css">
    #rateStatus{float:left; clear:both; width:100%; height:20px;}
    #rateMe{float:left; clear:both; width:100%; height:auto; padding:0px; margin:0px;}
    #rateMe li{float:left;list-style:none;}
    #rateMe li a:hover,
    #rateMe .on{background:url('Images/star2.ico') no-repeat;}
    #rateMe a{
        float: left;
        background: url('Images/star1.ico') no-repeat;
        width: 31px;
        height: 30px;
    }
    #ratingSaved{display:none;}
    .saved{color:red; }
</style> 

<script type="text/javascript" language="javascript" src="ratingsys.js"></script> 

    </form>
<p>
    &nbsp;</p>
</body>
</html>

JavaScript (ratingsys.js):

/*
Author: Addam M. Driver
Date: 10/31/2006
*/

var sMax; //  maximum number of stars
var holder; //  holding pattern for clicked state
var preSet; //  value once a selection has been made
var rated; // rated value


// Rollover for image Stars //
function rating(num)
{
    sMax = 0;
    // Is the maximum number of stars

for(n=0; n<num.parentNode.childNodes.length; n++)

    {

if(num.parentNode.childNodes[n].nodeName == "A")

        {
            sMax++; 

    }

}


if(!rated)

    {

    s = num.id.replace("_", ''); 
// Get the selected star

a = 0;

    for(i=1;i<=sMax;i++)

    {       

        if(i<=s)

    {

    document.getElementById("_"+i).className = "on";

            document.getElementById("rateStatus").innerHTML = num;  
                holder = a+1;
                a++;
            }
            else
            {
                document.getElementById("_"+i).className = "";
            }
        }
    }
}

// For when you roll out of the the whole thing //
function off(me)
{
    if(!rated)
    {
        if(!preSet)
        {   
            for(i=1; i<=sMax; i++)
            {       
                document.getElementById("_"+i).className = "";
                document.getElementById("rateStatus").innerHTML = me.parentNode;
            }
        }
        else
        {
            rating(preSet);
            document.getElementById("rateStatus").innerHTML = document.getElementById("ratingSaved").innerHTML;
        }
    }
}

// When you actually rate something //
function rateIt(me)
{
    if(!rated)
    {
        document.getElementById("rateStatus").innerHTML = document.getElementById("ratingSaved").innerHTML + me.title;
        preSet = me;
        rated=1;
        sendRate(me);
        rating(me);
        }
}

// Send the rating information somewhere using Ajax or something like that.
function sendRate(sel)
{
        //alert("Your rating was: "+sel.title);
}

Your urgent response in this matter will be highly appreciated.

Coding, with amendments, or any other resources, will also help.

Thank you in advance

Regards,

Lancy