All,

Here is some JavaScript I found. It creates a small scrollbar, which allows a user to scroll though a series of 5 images. The images represent votes, and the user can then press a "Rate us" button in order to cast a vote. As you can see in the code, followed by the images loading section, the default image/rating is set at 5. I would like to dynamically change this with a value stored in MySQL by passing the variable via PHP. I would again like to pass the new variable (the image/rating the user chose before selecting the submit button) to MySQL via PHP again. I'm not sure if this is even possible, but I thought I'd ask. I don't know JavaScript, so I'm sorry if this a noob question, cause I am. I do know PHP and MySQL though.

I'm open to other options as well. But I really like the idea of a small scrollbar and the ability to scroll through a series of images and cast a vote based on the image chosen. Could this be done in Flash? If JavaScripts work, I'd rather use that, cause I've got all the code right in front of me. :) .... and now you.

Here is the code. I've also zipped and attached a working version. Just unzip the folder and htm file, and run the index.htm file.

Thanks!!!

var	set_action = "";
var	set_path	= "images/";
var	set_id="<!--%ID%-->";
var	set_spacer 	= "spacer.gif";
var	set_scroll 	= "f0.gif";
var	set_thumb 	= "f1.gif";
var	set_rate1	= "1.gif";
var	set_rate2	= "25.gif";
var	set_rate3	= "5.gif";
var	set_rate4	= "75.gif";
var	set_rate5	= "10.gif";
var	set_mark1	= "1";
var	set_mark2	= "2";
var	set_mark3	= "3";
var	set_mark4	= "4";
var	set_mark5	= "5";
var	set_text	= "";
var	set_submit	= "Rate us";
//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() 
{
// I need to be able to set this value dynamically.  Currently it is statically set to 5. 
 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;
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();
//-->")));

You cannot pass variables, per se, between JavaScript and PHP. However, your PHP script can certainly author JavaScript, including JavaScript variables. I hope that makes sense, because it's late and I don't feel like debugging all that code you posted. Thanks for using code tags, though!

Seriously, with your JavaScript, use PHP to simpy "echo" the JavaScript variable.

Alright, I'll get right on that. Anyone else?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.