By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,730 Members | 1,524 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,730 IT Pros & Developers. It's quick & easy.

simple error?

P: n/a
Hello,

I am trying to print out the array values for a second time but get
error on page message?

Thanks

Geoff

<html>
<HEAD>

<SCRIPT language="JavaScript">
<!--
function display_questions()
{
var questions= new Array(5)
questions[0]="question 1";
questions[1]="question 2";
questions[2]="question 3";
questions[3]="question 4";
questions[4]="question 5";
var x=0;
for (x=0; x<5; x++)
{
document.write(questions[x] + "<br>");
}
document.write("<input type='button' value='again' onclick='again()' /
");


}

function again()
{
var i=0;
for (i = 0; i<5; i++)
{
document.write(this.questions[i] + "<br>");
}

}
</SCRIPT>

</HEAD>
<BODY>

<input type="button" value="see questions"
onclick="display_questions()" />
</BODY>
</html>

Sep 2 '05 #1
Share this Question
Share on Google+
18 Replies


P: n/a
Hi Geoff,
The problem is when you did "document.write" you actually cleared
the function "again" itself. Thats why it complains "again is
notdefined".
Solutions:
1. Write "again" function again using document.write().
[OR]
2. Dont use document.write, instead write dynamically in a "div" or
"span".

- Peroli Sivaprakasam

Geoff Cox wrote:
Hello,

I am trying to print out the array values for a second time but get
error on page message?

Thanks

Geoff

<html>
<HEAD>

<SCRIPT language="JavaScript">
<!--
function display_questions()
{
var questions= new Array(5)
questions[0]="question 1";
questions[1]="question 2";
questions[2]="question 3";
questions[3]="question 4";
questions[4]="question 5";
var x=0;
for (x=0; x<5; x++)
{
document.write(questions[x] + "<br>");
}
document.write("<input type='button' value='again' onclick='again()' /
");


}

function again()
{
var i=0;
for (i = 0; i<5; i++)
{
document.write(this.questions[i] + "<br>");
}

}
</SCRIPT>

</HEAD>
<BODY>

<input type="button" value="see questions"
onclick="display_questions()" />
</BODY>
</html>


Sep 2 '05 #2

P: n/a
On 2 Sep 2005 01:57:24 -0700, "Peroli" <pe****@gmail.com> wrote:
Hi Geoff,
The problem is when you did "document.write" you actually cleared
the function "again" itself. Thats why it complains "again is
notdefined".
Solutions:
1. Write "again" function again using document.write().
[OR]
2. Dont use document.write, instead write dynamically in a "div" or
"span".


Peroli,

Could you please give me an idea what you mean by the second option?!

Cheers

Geoff

Sep 2 '05 #3

P: n/a
Geoff Cox <ge*******@notquitecorrectfreeuk.com> writes:
I am trying to print out the array values for a second time but get
error on page message?
What error message do you get? (If you use IE, you should enable
error messages when doing development).
<SCRIPT language="JavaScript">
Should be <script type="text/javascript">
<!--
Not necessary.
function display_questions()
{
var questions= new Array(5)
Here "questions" is declared as a local variable inside the
"display_questions" function. The "questions" variable is only
visible inside this function.
document.write("<input type='button' value='again' onclick='again()' /
");

You seem to be trying to document.write an XHTML element (the closing
"/>" looks like XHTML), but document.write generally doesn't work
for XHTML pages parsed as such.

Anyway, when this button is clicked, the again function is called.
function again()
{
var i=0;
for (i = 0; i<5; i++)
A little shorter:
for (var i = 0; i < 5; i++)
{
document.write(this.questions[i] + "<br>");
This is called through a user click on a button. That suggests that the
page is already done loading when this is called. Doing "document.write"
on a page after it has finished loading will erase the entire page, and
replace it with what is written.

Also, the "this" operator refers to the global object (aka "window"),
which doesn't have a "questions" property.
<input type="button" value="see questions"
onclick="display_questions()" />


And this calls the first function, which also erases the page.

Generally, document.write is not the way to add content to a page
that is already loaded. There are different ways to do that, either
through the W3C DOM or using the proprietary "innerHTML" property.
<URL:http://jibbering.com/faq/#FAQ4_15>

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
Sep 2 '05 #4

P: n/a
On Fri, 02 Sep 2005 17:36:16 +0200, Lasse Reichstein Nielsen
<lr*@hotpop.com> wrote:

Generally, document.write is not the way to add content to a page
that is already loaded. There are different ways to do that, either
through the W3C DOM or using the proprietary "innerHTML" property.
<URL:http://jibbering.com/faq/#FAQ4_15>


Lasse,

Thanks for your comments - how does using

"<div ID='"d_name">data</div>"

work when I try to write out the 5 array values?

Cheers

Geoff
Sep 2 '05 #5

P: n/a

Geoff Cox wrote:
On Fri, 02 Sep 2005 17:36:16 +0200, Lasse Reichstein Nielsen
<lr*@hotpop.com> wrote:

Generally, document.write is not the way to add content to a page
that is already loaded. There are different ways to do that, either
through the W3C DOM or using the proprietary "innerHTML" property.
<URL:http://jibbering.com/faq/#FAQ4_15>


Lasse,

Thanks for your comments - how does using

"<div ID='"d_name">data</div>"

work when I try to write out the 5 array values?

Cheers

Geoff


Hi Geoff,

This is how it would work:
function display_questions()
{
var questions= new Array(5)
questions[0]="question 1";
questions[1]="question 2";
questions[2]="question 3";
questions[3]="question 4";
questions[4]="question 5";

var str_questions = "";

for (var i=0; i < question.length; ++i)
{
str_questions += questions[i] + "<br>";
}

document.getElementById("d_name").innerHTML = str_questions;
}

OR even better yet, take the following shortcut if all you're doing is
adding the same string at the end.

function display_questions()
{
var questions= new Array(5)
questions[0]="question 1";
questions[1]="question 2";
questions[2]="question 3";
questions[3]="question 4";
questions[4]="question 5";

var output = questions.join("<br>");

document.getElementById("d_name").innerHTML = output;
}
Hope this helps. :)

Sep 2 '05 #6

P: n/a
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>

Sep 2 '05 #7

P: n/a
hi Geoff,

function saveIt2()
{
for (var i = 0; i <5; i++)
{
document.write(this.slider_value[i] + "<br>");
}
}


Again the problem is with document.write(). Please avoid it if you
don't know what you are doing. Try writing in a new "div" or "span".

[UNTESTED]
<div id="mydiv"></div>

function saveIt2()
{
for (var i = 0; i <5; i++)
{
document.getElementById('mydiv').innerHTML += this.slider_value[i] +
"<br>";
}
}

- Peroli Sivaprakasam

Sep 3 '05 #8

P: n/a
On 3 Sep 2005 00:24:35 -0700, "Peroli" <pe****@gmail.com> wrote:

Again the problem is with document.write(). Please avoid it if you
don't know what you are doing. Try writing in a new "div" or "span".

[UNTESTED]
<div id="mydiv"></div>

function saveIt2()
{
for (var i = 0; i <5; i++)
{
document.getElementById('mydiv').innerHTML += this.slider_value[i] +
"<br>";
}
}
Thanks Peroli - think I will get the O'Reilly Book on JavaScript -
seems to be well thought of?

Cheers

Geoff


- Peroli Sivaprakasam


Sep 3 '05 #9

P: n/a
On 3 Sep 2005 00:24:35 -0700, "Peroli" <pe****@gmail.com> wrote:

Peroli,

I have used your code but for some reason I am getting the last value
of the array repeated at the beginning in the dat sent via email - can
you see why?

Geoff

function saveIt()
{
for (var i = 0; i < slider_value.length; ++i)
{
document.getElementById("Slider1ValueText").innerH TML +=
this.slider_value[i] + " ";
}

var situation = "Social Group";
var url = 'http://website/path/cgi-bin/formmail-nms2.cgi';
var pars = 'Situation: ' + situation + ' ' + 'Name: ' + name + ' ' +
'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;
var myAjax = new Ajax.Updater('Status', url, {method: 'post',
parameters: pars});
}
Sep 3 '05 #10

P: n/a
Hi Geoff,
My answers are embedded.

Geoff Cox wrote:
On 3 Sep 2005 00:24:35 -0700, "Peroli" <pe****@gmail.com> wrote:

Peroli,

I have used your code but for some reason I am getting the last value
of the array repeated at the beginning in the dat sent via email - can
you see why?

Geoff

function saveIt()
{
for (var i = 0; i < slider_value.length; ++i)
Here you are using ++i, which have to be i++. Think of the
difference between ++i and i++, you will know why.

{
document.getElementById("Slider1ValueText").innerH TML +=
this.slider_value[i] + " ";
}

var situation = "Social Group";
var url = 'http://website/path/cgi-bin/formmail-nms2.cgi';
var pars = 'Situation: ' + situation + ' ' + 'Name: ' + name + ' ' +
'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;

Here i don't know what you are doing. See, to send name-value pair in
HTTP, each name value has to be delimited by '=' and each name-value
pair has to be delimited by '&'. So your values must have been

var pars = 'Situation=' + situation + '&' + 'Name=' + name + '&' +

'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;

var myAjax = new Ajax.Updater('Status', url, {method: 'post',
parameters: pars});
}


Well, i hope this will do.

- Peroli Sivaprakasam

Sep 5 '05 #11

P: n/a
Peroli wrote:
Hi Geoff,
My answers are embedded.

Geoff Cox wrote:
On 3 Sep 2005 00:24:35 -0700, "Peroli" <pe****@gmail.com> wrote:

Peroli,

I have used your code but for some reason I am getting the last value
of the array repeated at the beginning in the dat sent via email - can
you see why?

Geoff

function saveIt()
{
for (var i = 0; i < slider_value.length; ++i)

Here you are using ++i, which have to be i++. Think of the
difference between ++i and i++, you will know why.


In the context of this for loop, the difference between i++ and ++i is
insignificant and should not, by itself, cause the errant behaviour.

[...]
Here i don't know what you are doing. See, to send name-value pair in
HTTP, each name value has to be delimited by '=' and each name-value
pair has to be delimited by '&'. So your values must have been

var pars = 'Situation=' + situation + '&' + 'Name=' + name + '&' +

'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;


Not HTTP: the use of '&' and '=' is from the HTML specification and is
the standard way to send form data.

<URL:http://www.w3.org/TR/html4/interact/forms.html#h-17.13.4.1>

Custom delimited text strings can be generated from form data, put into
a hidden element and sent with the form submission or using XMLHttpRequest.

As for the OP's problem, it's hard to determine what the issue might be
given that the code depends on two script files that aren't posted, uses
document.write to replace document content and the posted code has
auto-line breaks that introduce errors.

[...]

--
Rob
Sep 5 '05 #12

P: n/a
Hi RobG,

RobG wrote:
In the context of this for loop, the difference between i++ and ++i is
insignificant and should not, by itself, cause the errant behaviour.

My apologies RobG, i was in an idea that the loop will start with 1 and
not from 0. Now i tested it myself and thanks for pointing this to me.

Here i don't know what you are doing. See, to send name-value pair in
HTTP, each name value has to be delimited by '=' and each name-value
pair has to be delimited by '&'. So your values must have been

var pars = 'Situation=' + situation + '&' + 'Name=' + name + '&' +

'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;


Not HTTP: the use of '&' and '=' is from the HTML specification and is
the standard way to send form data.


Sorry for the typo. I actually meant HTML Form.
<URL:http://www.w3.org/TR/html4/interact/forms.html#h-17.13.4.1>

Custom delimited text strings can be generated from form data, put into
a hidden element and sent with the form submission or using XMLHttpRequest.

[reference: prototype.js <http://prototype.conio.net>]

var situation = "Social Group";
var url = 'http://website/path/cgi-bin/fo rmmail-nms2.cgi';
var pars = 'Situation: ' + situation + ' ' + 'Name: ' + name + ' ' +
'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;
var myAjax = new Ajax.Updater('Status', url, {method: 'post',
parameters: pars})

But as you can see the user didn't set custom delimited value in a
hidden field here. If such is the case i would not have pointed out.
As for the OP's problem, it's hard to determine what the issue might be
given that the code depends on two script files that aren't posted, uses
document.write to replace document content and the posted code has
auto-line breaks that introduce errors.

Yes. But the problem has been solved in another post.
[...]

--
Rob


- Peroli Sivaprakasam

Sep 5 '05 #13

P: n/a
On 5 Sep 2005 00:23:35 -0700, "Peroli" <pe****@gmail.com> wrote:
Yes. But the problem has been solved in another post.


Peroli,

I don't think it has been solved (unless I have missed something?).

One suggested explanation was that the repeated last value, which
appeared first in the data sent by email, had come from the <DIV etc -
in fact I am using a <SPAN etc which I am creating as part of building
a table

document.write("<SPAN class='invisible'
ID='Slider1ValueText'></SPAN>");

so don't see how the repeated slider value can come from here. Plus,
it is always the same as the last slider value??

The problematic code is below ..

Cheers

Geoff
function saveIt()

{

for (var i = 0; i < slider_value.length; i++)
{
document.getElementById("Slider1ValueText").innerH TML
+= this.slider_value[i] + " ";
}

var url = 'http://website/path/formmail-nms.cgi';
var pars = 'Situation=' + situation + '&' + 'Name=' + name + '&' +
'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;
var myAjax = new Ajax.Updater('Status', url, {method: 'post',
parameters: pars});

}
Sep 5 '05 #14

P: n/a
Hi Geoff,
My suggestions are embedded.

Geoff Cox wrote:
On 5 Sep 2005 00:23:35 -0700, "Peroli" <pe****@gmail.com> wrote:
Yes. But the problem has been solved in another post.
Peroli,

I don't think it has been solved (unless I have missed something?).


Sorry, i thought it was fixed.
One suggested explanation was that the repeated last value, which
appeared first in the data sent by email, had come from the <DIV etc -
in fact I am using a <SPAN etc which I am creating as part of building
a table

document.write("<SPAN class='invisible'
ID='Slider1ValueText'></SPAN>");

so don't see how the repeated slider value can come from here. Plus,
it is always the same as the last slider value??

The problematic code is below ..

Cheers

Geoff
function saveIt()

{

for (var i = 0; i < slider_value.length; i++)
{
document.getElementById("Slider1ValueText").innerH TML
+= this.slider_value[i] + " ";
}

var url = 'http://website/path/formmail-nms.cgi';
var pars = 'Situation=' + situation + '&' + 'Name=' + name + '&' +
'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;
var myAjax = new Ajax.Updater('Status', url, {method: 'post',
parameters: pars});
Try adding this piece of code here.

document.getElementById("Slider1ValueText").innerH TML = '';
}


- Peroli Sivaprakasam

Sep 6 '05 #15

P: n/a
On 5 Sep 2005 20:41:54 -0700, "Peroli" <pe****@gmail.com> wrote:

var url = 'http://website/path/formmail-nms.cgi';
var pars = 'Situation=' + situation + '&' + 'Name=' + name + '&' +
'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;
var myAjax = new Ajax.Updater('Status', url, {method: 'post',
parameters: pars});

Try adding this piece of code here.

document.getElementById("Slider1ValueText").innerH TML = '';


Peroli,

Sorry - not sure what you mean above? In addition or replace what?

Thanks

Geoff
Sep 6 '05 #16

P: n/a
On 5 Sep 2005 20:41:54 -0700, "Peroli" <pe****@gmail.com> wrote:

var url = 'http://website/path/formmail-nms.cgi';
var pars = 'Situation=' + situation + '&' + 'Name=' + name + '&' +
'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;
var myAjax = new Ajax.Updater('Status', url, {method: 'post',
parameters: pars});

Try adding this piece of code here.

document.getElementById("Slider1ValueText").innerH TML = '';


Peroli,

Is this what you meant?

I added

document.getElementById("Slider1ValueText").innerH TML = "";

for (var i = 0; i < slider_value.length; i++)
{
document.getElementById("Slider1ValueText").innerH TML +=
this.slider_value[i] + ' ';
}

ie making the

document.getElementById("Slider1ValueText").innerH TM

empty before the loop started and

it now works OK!

I still cannot understand how the last array item gets repeated at the
beginning!

Cheers

Geoff

Sep 6 '05 #17

P: n/a
Hi Geoff,
Yes, i meant to add the code there.

Geoff Cox wrote:
On 5 Sep 2005 20:41:54 -0700, "Peroli" <pe****@gmail.com> wrote:

var url = 'http://website/path/formmail-nms.cgi';
var pars = 'Situation=' + situation + '&' + 'Name=' + name + '&' +
'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;
var myAjax = new Ajax.Updater('Status', url, {method: 'post',
parameters: pars});
Try adding this piece of code here.

document.getElementById("Slider1ValueText").innerH TML = '';


Peroli,

Is this what you meant?

I added

document.getElementById("Slider1ValueText").innerH TML = "";

for (var i = 0; i < slider_value.length; i++)
{
document.getElementById("Slider1ValueText").innerH TML +=
this.slider_value[i] + ' ';
}

ie making the

document.getElementById("Slider1ValueText").innerH TM

empty before the loop started and

it now works OK!


You got it.
I still cannot understand how the last array item gets repeated at the
beginning!
for (var i = 0; i < slider_value.length; i++)
{
-->>>>>> document.getElementById("Slider1ValueText").innerH TML +=
this.slider_value[i] + ' ';
}

Well, see the is with the line i have marked. Lets say when you load
the page, the "Slider1ValueText" span is empty and you are happy with
its working. Now when you move the slider again and post it to server,
the older value which was not cleared is prepended (see "+=" there).
Thats all.

Cheers

Geoff


- Peroli Sivaprakasam

Sep 6 '05 #18

P: n/a
On 6 Sep 2005 05:09:31 -0700, "Peroli" <pe****@gmail.com> wrote:
Hi Geoff,
Yes, i meant to add the code there.
Peroli,

OK - thanks for all your help.

Cheers

Geoff





Geoff Cox wrote:
On 5 Sep 2005 20:41:54 -0700, "Peroli" <pe****@gmail.com> wrote:

>> var url = 'http://website/path/formmail-nms.cgi';
>> var pars = 'Situation=' + situation + '&' + 'Name=' + name + '&' +
>> 'Slider_Values='+document.getElementById('Slider1V alueText').innerHTML;
>> var myAjax = new Ajax.Updater('Status', url, {method: 'post',
>> parameters: pars});
>>
>Try adding this piece of code here.
>
> document.getElementById("Slider1ValueText").innerH TML = '';


Peroli,

Is this what you meant?

I added

document.getElementById("Slider1ValueText").innerH TML = "";

for (var i = 0; i < slider_value.length; i++)
{
document.getElementById("Slider1ValueText").innerH TML +=
this.slider_value[i] + ' ';
}

ie making the

document.getElementById("Slider1ValueText").innerH TM

empty before the loop started and

it now works OK!


You got it.
I still cannot understand how the last array item gets repeated at the
beginning!

for (var i = 0; i < slider_value.length; i++)
{
-->>>>>> document.getElementById("Slider1ValueText").innerH TML +=
this.slider_value[i] + ' ';
}

Well, see the is with the line i have marked. Lets say when you load
the page, the "Slider1ValueText" span is empty and you are happy with
its working. Now when you move the slider again and post it to server,
the older value which was not cleared is prepended (see "+=" there).
Thats all.

Cheers

Geoff


- Peroli Sivaprakasam


Sep 6 '05 #19

This discussion thread is closed

Replies have been disabled for this discussion.