On Fri, 02 Sep 2005 08:00:07 GMT, Geoff Cox
<ge*******@notquitecorrectfreeuk.com> wrote:
web dev
Many thanks for your reply. I have tried the first approach and that
works fine but probably better now if I try to explain what I am
trying to do!
The code below works OK up to a point but the function saveIt2() is
wrong and my original post was supposed to help me understand why!
The aim is to present an image and a series of questions which the
user answers by positioning the slider. I want to put the slider value
into an array and then when the last question has been answered the
next click of the Next button will send the array values to me by
email. To try to simplify things I am just trying to print out the
array values using saveIt2(().
Can you see what is going wrong with saveIt2()?
Cheers
Geoff
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<HEAD>
<link rel=stylesheet href="slider.css" type="text/css">
<SCRIPT SRC="slider.js"></SCRIPT>
<SCRIPT SRC="prototype-1.3.1.js"></SCRIPT>
<SCRIPT>
var mySlider1 = new Slider( "Slider1" );
var count = 0;
var slider_value = new Array(5)
mySlider1.leftValue = 0;
mySlider1.rightValue = 10;
mySlider1.defaultValue = 0;
mySlider1.offsetX = 1;
mySlider1.offsetY = 1;
mySlider1.maxSlide = 258;
mySlider1.onmouseover = "self.status='Try me!'";
mySlider1.onmousedown = "self.status='You start
at'+this.getValue(0)";
mySlider1.onmouseup = "self.status='You end at '+this.getValue(0)";
mySlider1.onchange = "self.status='The current value
is'+this.getValue(0)";
mySlider1.onclick = "this.setValue(this.defaultValue)";
mySlider1.onchange
="document.getElementById('Slider1ValueText').inne rHTML
=''+this.getValue(0)";
var lhs_questions = new Array(5)
lhs_questions[0]="LHS question 1";
lhs_questions[1]="LHS question 2";
lhs_questions[2]="LHS question 3";
lhs_questions[3]="LHS question 4";
lhs_questions[4]="LHS question 5";
var rhs_questions = new Array(5)
rhs_questions[0]="RHS question 1";
rhs_questions[1]="RHS question 2";
rhs_questions[2]="RHS question 3";
rhs_questions[3]="RHS question 4";
rhs_questions[4]="RHS question 5";
function buildTable()
{
document.write("<center>");
document.write("<table border='2'>");
document.write("<tr>");
document.write(" <td ID='lhs_question'>" + this.lhs_questions[0] +
"</td>");
document.write(" <td>" + "<IMG SRC='sliderbg.gif'
NAME='Slider1RailImg' ID='Slider1RailImg'>" + "</td>");
document.write(" <td ID='rhs_question'>" + this.rhs_questions[0] +
"</td>");
document.write("</tr>");
document.write("</table>");
document.write("</center>");
}
function next_question()
{
slider_value[count] = this.mySlider1.getValue(0);
this.count++;
if (this.count < 5)
{
document.getElementById('lhs_question').innerHTML =
this.lhs_questions[count];
document.getElementById('rhs_question').innerHTML =
this.rhs_questions[count];
} else
{
saveIt2();
}
}
function saveIt()
{
var url = 'http://path/formmail.cgi';
var pars =
'sliderVal='+document.getElementById('Slider1Value Text').innerHTML;
var myAjax = new Ajax.Updater('Status', url, {method: 'post',
parameters: pars});
}
function saveIt2()
{
for (var i = 0; i <5; i++)
{
document.write(this.slider_value[i] + "<br>");
}
}
</script>
</HEAD>
<BODY onLoad="mySlider1.placeSlider()">
<h2 align="center">Social Group</h2>
<p align="center"><img src="pic3.jpg"></p>
<script language="javascript"
type="text/javascript">buildTable();</script>
<center>
<table>
<tr>
<td colspan="3" align="center">
<input type="button" value="Next" onclick="next_question()" />
<SPAN class="invisible" ID="Slider1ValueText"></SPAN>
<SPAN ID="Status"></SPAN></td></tr>
</TABLE>
</center>
<SCRIPT>
mySlider1.writeSlider();
</SCRIPT>
</body>
</html>
