Problems With Document.write!!

[moshlp]

hi, i´ve downloaded an useful script for a fill in the blank task.It works great,but there is a detail i´d like to change and I dunno how.There is a button called WHAT WAS WRONG that shows the answers in the same page,the problem is that I want this page to appear in a pop-up instead,and I think that for doing that I need an .htm page,how do I do that?,cuz this script creates a different .htm to show the answers called differently every time.The URL is http://nelingles.com/cancion3_avril_complicated.htm
please help me!!!

p/s: the idea is that after u do the exercises ,press CHECK YOUR WORK and then WHAT WAS WRONG and in a pop-up you get the answers and can compare,instead of having to use the BACK button in your browser to go back to the song.

[Jona]

OK, before all of you functions declare a variable:


var finalAnswers;


Now in the latter part of the code, you will see your document.write("Your answer was <i>"+ans1+"</i>. Correct answer: Answer"). You will see this multiple times. Replace the above with this:


finalAnswers+="Your answer was <i>"+ans1+"</i>. Correct answer: answer.<br>";


Now after all of the checking is complete, put in this to make the popup window:


var myW = window.open("","finalAnswers","width=400,height=400,scrollbars=no,resizable=yes,menubar=no");
myW.document.write(finalAnswers);


Jona

[moshlp]

OK,I´ve done what you say,but now the pop-up appears as soon as I load the page saying UNDEFINED and nothing appears when I press WHAT WAS WRONG.I give u part of the script.

//correct answer
if (ans1 == que1) {
finalAnswers+="1) You Answered Correct. <br>";
}
//didnt answer
else {
if (ans1 =="") {
finalAnswers+="1) You didn't Answer this Question. <br>";
}
//wrong answer
else {
finalAnswers+="1) You wrote <i>" + ans1 + "</i>. When you should've written " + que1 +".<br>";
}
}

This is what i´ve got,i´ve changed document.write for finalAnswers,in all the answers.

<meta name="ProgId" content="FrontPage.Editor.Document">
<title></title>
<script language="javascript">
<!--

var finalAnswers;
function checkform() {
right = 0;
.
.
Is it there where you told me to write finalAnswers???

Please,reply to this post,because I know you can help me with this.Thank you very much so far.

[Jona]

Yes, you did do it right. Now just add the opening window code.

Edit: Try putting var finalAnswers = ""; instead of var finalAnswers; at the beginning.

Jona

[moshlp]

ok,but..what opening window code?

[Jona]

Originally posted by Jona
Now after all of the checking is complete, put in this to make the popup window:


var myW = window.open("","finalAnswers","width=400,height=400,scrollbars=no,resizable=yes,menubar=no");
myW.document.write(finalAnswers);


Jona

[moshlp]

The pop-up is still appearing as soon as the page is loaded,but without saying UNDEFINED ,just blank,and when I press WHAT WAS WRONG,nothing happens.

[Jona]

Make sure you put that code in the function that executes onClick of the "What was wrong?" button. Also, could you post a link? (The one you posted above has not changed, so I'm assuming you're testing this somewhere else.)

Jona

[moshlp]

the link is http://nelingles.com/Damian/fill_pop-up.htm

[Jona]

Put this code before the last brace ( } ):


if(finalAnswers!=""){
var myW = window.open("","finalAnswers","width=400,height=400,scrollbars=yes,menubar=no");
myW.document.write(finalAnswers);}


Jona

[moshlp]

MILLIONS AND MILLIONS OF THANK YOU!!!!!!.Really,your tips have been so useful....
The pop-up appears great,can I make it appear centered in the page?,and if I press RESET and fill the gaps again,and then WHAT WAS WRONG ,the previous answers also appear,can I make them disappear and that appear only the new ones?
Now,is there any way that for a text field to show the result of different colours ,depending on the answer?

e.g.:
if (ans5 == que5) {
right++
document.myquiz.a5c.value = "+1"; I WANT THIS TO APPEAR IN BLUE
}
else {
document.myquiz.a5c.value = "X"; AND THIS TO APPEAR IN RED
}


THANK YOU VERY MUCH

[Jona]

To make the window in the center of the page, use this (I think it will work. lol):


if(finalAnswers!=""){
var myW = window.open("","finalAnswers","width=400,height=400,scrollbars=yes,menubar=no");
myW.moveTo(screen.width/2, screen.height/2);
myW.document.write(finalAnswers);}


Just add <span stlye='color:blue;'>+1</span> and <span stlye='color:red;'>X</span> instead of just +1 and X. And in your code take out the style for it to be that color in the new window.

Jona

[moshlp]

GREAT!!!!,it´s looks really nice now.
Can u help me the problem with the repetition of answers?.It doesn´t erase the previous answers and show them altogether.

[Jona]

if(finalAnswers!=""){
var myW = window.open("","finalAnswers","width=400,height=400,scrollbars=yes,menubar=no");
myW.moveTo(screen.width/2, screen.height/2);
myW.document.write(finalAnswers);
finalAnswers="";}


Jona

[moshlp]

good,now it clears it out.Now,is this the way you told me put the script for the colors?

if (ans1 == que1) {
right++
document.myquiz.a1c.value =<span style='color:blue;'>+1</span>;
else {
document.myquiz.a1c.value = "X";
}

because it doesn´t work

[Jona]

Hmm... Not quite. I was just thinking and realized that you're putting this in a form box, so that code wouldn't work. o_O Try this...


if (ans1 == que1) {
right++
document.myquiz.a1c.value ="+1";
else {
document.myquiz.a1c.value = "X";
}
//etc. if/else/else if statements...
finalAnswers=finalAnswers.split("+1").join("<span stlye='color:blue;'>+1</span>");
finalAnswers=finalAnswers.split("X").join("<span style='color:red;'>X</span>");
if(finalAnswers!=""){
var myW = window.open("","finalAnswers","width=400,height=400,scrollbars=yes,menubar=no");
myW.moveTo(screen.width/2, screen.height/2);
myW.document.write(finalAnswers);
finalAnswers="";}
}


Jona

[moshlp]

they are still been seen RED ,but i guess because the text field has the color red already defined,i think....take a look:

<input type="text" size="6" name="a14c" value="" style="color: #FF2200; font-family: Century Gothic; border-style: solid; border-color: #FFFFFF">
</font></p>

is there any way to change it,in order to behave as the script you gave me?

[Jona]

Did you not want the popup window to have blue or red colors for +1 or X? Or did you want those to be in the text field?

Jona

[moshlp]

the thing is that these answers appear in the page,not in the pop-up.The use of document.write in the page is OK.In the pop-up appear only the answers ,no the +1 or X,these ones appear in the page.And in the page is where I want the +1 and X appear in different colors.I´ll post a link for you to have an idea.

http://nelingles.com/cancion3_avril_complicated.htm

write something in the text fields,press CHECK YOUR WORK,and you´ll see that some RIGHT!(instead of +1) and X appear,and they are OK,but i want them to appear in different colors

[Jona]

Oh I see, just use document.formname.a1c.style.color="blue"; in your if statements (like if(document.formname.a1c.value==""){ blah blah blah} else { blah blah blah } ).

Jona