JavaScripters,
This question is in regards to a JavaScript script within a PHP page. I included everything in case a complete understanding is required for a correct response.
Thanks in advance.
****INFO****
Rater.php has a JavaScript script, which displays an interactive rating tool. It allows a user to slide a bar up and down while it displays various images that represent various rating levels. We'll call this the “selector". For example, an image of 5 stars represents the rating value of 5. There is a submit button, which interestingly enough submits the chosen rating. And we'll cleverly call this the "submit button". There is only one "selector" and one submit button.
****QUESTION****
Is there any way to create two "selectors" and have only one submit button? Essentially, having each of the selectors for rating two items, but only having to press one submit button, rather than the obvious scenario of selecting twice and submitting twice.
PHEW, hope someone reads this.
Here’s the code:
<?php
$ID = $_POST["ID"];
$rate = $_POST["rate"];
if (!isset($_POST['rate'])) {
?>
<html>
<head>
</head>
<body>
<script language="javascript" type="text/javascript">
var set_action = "<?php echo $PHP_SELF;?>";
var set_id = "000000000"; ////Future:<?PHP echo $IMAGE_ID;?>, but 0X9 for now.
var set_path = "images/";
var set_spacer = "spacer.gif";
var set_scroll = "f0.gif";
var set_thumb = "f1.gif";
var set_rate1 = "1.gif";
var set_rate2 = "2.gif";
var set_rate3 = "3.gif";
var set_rate4 = "4.gif";
var set_rate5 = "5.gif";
var set_mark1 = "1";
var set_mark2 = "2";
var set_mark3 = "3";
var set_mark4 = "4";
var set_mark5 = "5";
var set_text = "set_text";
var set_submit = "Rate";
//SETTINGS END
var gotkl = 0;
var path = set_path;
var index = 0;
var firstTime = true;
var img_f = new Array();
img_f[0] = new Image();
img_f[1] = new Image();
img_f[0].src= path + set_scroll;
img_f[1].src= path + set_thumb;
//Files with images
var img_p = new Array();
img_p[1] = new Image();
img_p[2] = new Image();
img_p[3] = new Image();
img_p[4] = new Image();
img_p[5] = new Image();
set_spacer =path + set_spacer;
img_p[1].src=path + set_rate1
img_p[2].src=path + set_rate2
img_p[3].src=path + set_rate3
img_p[4].src=path + set_rate4
img_p[5].src=path + set_rate5
function imgonload()
{
document.id_pn.src = img_p[5].src;
}
flg = (document.all) ? 0 : 1;
var obj;
var dx,dy;
var flag = false;
function mousedown(ev)
{
if (flg)
{
X=ev.clientX;
Y=ev.clientY;
return false;
}
else
{
X=event.clientX;
Y=event.clientY;
}
}
function mousemove(ev)
{
if (flag)
{
if (flg)
{
X2=ev.clientX;
Y2=ev.clientY;
}
else
{
X2=event.clientX;
Y2=event.clientY;
}
dy=Y2-Y;
var dh=document.id_spacer.height+dy;
if (dh>-1 && document.id_spacer.height+dy<document.id_pn.height-7) {
document.id_spacer.height = document.id_spacer.height+(Y2-Y);
Y=Y2;
};
if (dh<=-1)
{
document.id_spacer.height=1;
}
if (dh>=document.id_pn.height-7)
{
document.id_spacer.height=document.id_pn.height-8;
}
var mark=Math.floor(document.id_spacer.height/(document.id_pn.height/5));
//alert(mark);
mark=5-mark;
document.id_pn.src = img_p[mark].src
document.post_form.rate.value=mark;
//window.status=mark;
num = mark;
return false;
}
}
function mouseup()
{
obj = null;
flag = false;
}
if (flg)
{
document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
}
document.onmousedown = mousedown;
document.onmousemove = mousemove;
document.onmouseup = mouseup;
document.write(""+
"<table border='0' cellspacing='0' cellpadding='0' width='100px'>"+
" <tr>"+
" <td align='center'>"+
" <img align='middle' name='id_pn'>"+
" </td>"+
" <td id='scroll_cell' align='center' valign='top' width='20' background='"+img_f[0].src+"'>"+
"<table border=0 cellspacing='0' cellpadding='0'><tr><td><img border=0 name='id_spacer' width='20' height='0' src='"+set_spacer+"'></td></tr><tr><td><img width='20' height='8' border='0' id='id_pil' src='"+img_f[1].src+" 'style='cursor : hand;' onMouseDown='flag = true;' ></td></table>"+
" </td>"+
" </tr>"+
"<form action='"+set_action+"' method='post' name='post_form'>"+
" <tr>"+
" <td colspan='2' style='padding: 2px' align='left'>"+
" <input style='width:80%' type='submit' value='"+set_submit+"'>"+
" <input type='hidden' name='ID' value='"+set_id+"'><input type='hidden' name='rate' value='5'>"+
" </td>"+
" </tr></form></table>");
imgonload();
//-->")));
</script>
<?
} else {
echo "ID: ";
echo $ID;
echo "<br /><br />";
echo "Rate: ";
echo $rate;
}
?>
</body>
</html>