Click to See Complete Forum and Search --> : function load order
callwin
07-08-2003, 02:58 PM
I have two function being loaded on one onClick. The 2nd function is loaded
before the 1st one is completed. How can I get the 1st function to finish
loading before the 2nd function is loaded. Is there such a command call
sleep or pause that I can set up? I am not that skillful with java scripts.
Thank-u
Cindy
:confused:
It would help if you provided a link. Usually, it can be done this way:
onClick="function1(); function2();"
[J]ona
callwin
07-08-2003, 03:34 PM
I have it that way and stiil function 2 (exercise) load before function 1 (segments) is completed.
Here is my line that calls the functions
<INPUT TYPE="button" name="Segments" value="1. Collins" title="Click Here to select this exercise segment;" onClick="
segement(this.form);
exercise(this.form);"
onMouseOver="window.status='Click Here to select this exercise segment';
return true;"
</font style="border: 1px solid #0066FF; background-color: #0066FF"></p>
The segments funtion (function 1) is loading 3 parents iframes .
The exercise (function 2) function is loading a window.open and a parent iframe.
Is there such a command call timeout or pause so that fthe segments function (function 1) can complete loading?
Thanks
Cindy
onClick="segment(this.form); var loadFunc2 = setTimeout('exercise(this.form)', 1000);"
This will run the function one second after it was clicked (should be plenty of time, right?). It's actually one thousand milliseconds. You'll need to add this code to the beginning of exercise() though:
clearTimeout(loadFunc2);
[J]ona
callwin
07-08-2003, 03:58 PM
Hi, does the clearTimeout(loadFunc2) ; go into the exercise function?
Thank-u for helping me.
:)
Yes, I said it should be the first line in the exercise() function.
[J]ona
callwin
07-09-2003, 10:14 AM
I added those lines in and it does not work.
Here is what I have added
Thanks
Cindy
function segement(form) {
parent.I3.location='seg1/actions.html';
parent.pix.location='images/John.jpg';
parent.info.location='seg1/message/John.htm'
}
function getSelectedButton(buttonGroup){
for (var i = 0; i < buttonGroup.length; i++) {
if (buttonGroup[i].checked) {
return i
}
}
return 0
}
function exercise(form) {
clearTime(loadFunc2)
var i = getSelectedButton(form.gender)
if (form.gender[i].value != "John" ) {
alert("You have not choosen any Processor Emulation.")
}
else
if (form.gender[i].value == "John") {
alert("You choosen " + form.gender[i].value + ".")
window.open("images/John.jpg", "sub", "HEIGHT=200,WIDTH=200")
}
endif
endif
}
</SCRIPT>
</head>
<body style="word-spacing: 0; margin: 0; background-color: #0066FF;
vertical-align:top" link="#FFFFFF" vlink="#FFFF00" alink="#00FF00">
<table cellpadding="0" cellspacing="0" style="border-collapse: collapse; word-spacing: 0; margin: 0" width="346" id="AutoNumber2">
<tr>
<FORM METHOD=POST ENCTYPE="text/plain" onReset="return allowReset()" style="text-align: left; word-spacing: 0; margin: 0">
<td width="189" style="word-spacing: 0; border-left-width: 1; border-right: 2px solid #FFFFFF;
border-top-width: 1; border-bottom: 2px solid #FFFFFF; margin: 0">
<p>
<b><font color="#FFFFFF">
<INPUT TYPE="reset" size="10" value="1. Characters" style="color: #FFFFFF;
font-weight: bold;word-spacing: 0; margin: 0; background-color: #0066FF; width:183;
height:0; position:relative; float:left; left:0; top:0";
title="Click here to clear Character;"
onMouseOver="window.status='Click here to clear Characters';"
return true;
onClick="hardReload()"></font></b></td>
<td width="155" style="word-spacing: 0; border-left: 2px solid #FFFFFF;
border-bottom: 2px solid #FFFFFF; margin: 0">
<p style="text-align: center"><b>
<a title="Click here to clear Friends;"
onMouseOver="window.status='Click here to clear Friends';"
return false;
target="_top" href="index.html">2. Friends</a></b></td>
</tr>
<tr>
<td width="189" style="word-spacing: 0; border-right: 2px solid #FFFFFF; margin: 0">
<INPUT TYPE="radio" NAME="gender" value="John"> John<br>
<INPUT TYPE="radio" NAME="gender" value="Josh"> Josh<br>
<INPUT TYPE="radio" NAME="gender" value="KatyBeth"> KatyBeth<br>
<INPUT TYPE="radio" NAME="gender" value="Johnny & Hazel"> Johnny & Hazel<br>
<INPUT TYPE="radio" NAME="gender" value="Sarah"> Sarah<br>
<INPUT TYPE="radio" NAME="gender" value="NoNoBite"> NoNoBite<br>
<INPUT TYPE="radio" NAME="gender" value="Banana"> Banana<br>
<INPUT TYPE="radio" NAME="gender" value="Grassy & Sally"> Grassy & Sally<br>
<br>
<br>
</p>
<td width="48%" style="word-spacing: 0; border-left: 2px solid #FFFFFF; margin: 0" valign="top" align="center">
<p style="margin-top: 0pt; margin-bottom: 0pt;"><font color="#000000">
<INPUT TYPE="button" value="John" name="Segments" title="Click Here to select this Friend;"
onClick="segement(this.form); var loadFunc2 = setTimeout('exercise(ths.form)', 100);"
onMouseOver="window.status='Click Here to select this Friend';
return true;"
style="word-spacing: 0; border: 1px solid #0066FF; margin: 0; background-color: #0066FF"></font> </p>
:confused:
Khalid Ali
07-09-2003, 10:38 AM
This should do it.
function firstFunc(){
/*
some code here for
*/
//once the above is done then call the second function
secondFunc();
}
function secondFunc(){
/*
some code here for second function
*/
}
callwin
07-09-2003, 10:55 AM
Try that and still does not start the 2nd fucntion (exercise)
Here is part of the code.
function segement(form) {
parent.I3.location='seg1/actions.html';
parent.pix.location='images/John.jpg';
parent.info.location='seg1/message/John.htm'
exercise(this.form)
}
function getSelectedButton(buttonGroup){
for (var i = 0; i < buttonGroup.length; i++) {
if (buttonGroup[i].checked) {
return i
}
}
return 0
}
function exercise(form) {
var i = getSelectedButton(form.gender)
if (form.gender[i].value != "John" ) {
alert("You have not choosen any Processor Emulation.")
}
else
if (form.gender[i].value == "John") {
alert("You choosen " + form.gender[i].value + ".")
window.open("images/John.jpg", "sub", "HEIGHT=200,WIDTH=200")
}
endif
endif
}
</SCRIPT>
</head>
<body style="word-spacing: 0; margin: 0; background-color: #0066FF;
vertical-align:top" link="#FFFFFF" vlink="#FFFF00" alink="#00FF00">
<table cellpadding="0" cellspacing="0" style="border-collapse: collapse; word-spacing: 0; margin: 0" width="346" id="AutoNumber2">
<tr>
<FORM METHOD=POST ENCTYPE="text/plain" onReset="return allowReset()" style="text-align: left; word-spacing: 0; margin: 0">
<td width="189" style="word-spacing: 0; border-left-width: 1; border-right: 2px solid #FFFFFF;
border-top-width: 1; border-bottom: 2px solid #FFFFFF; margin: 0">
<p>
<b><font color="#FFFFFF">
<INPUT TYPE="reset" size="10" value="1. Characters" style="color: #FFFFFF;
font-weight: bold;word-spacing: 0; margin: 0; background-color: #0066FF; width:183;
height:0; position:relative; float:left; left:0; top:0";
title="Click here to clear Character;"
onMouseOver="window.status='Click here to clear Characters';"
return true;
onClick="hardReload()"></font></b></td>
<td width="155" style="word-spacing: 0; border-left: 2px solid #FFFFFF;
border-bottom: 2px solid #FFFFFF; margin: 0">
<p style="text-align: center"><b>
<a title="Click here to clear Friends;"
onMouseOver="window.status='Click here to clear Friends';"
return false;
target="_top" href="index.html">2. Friends</a></b></td>
</tr>
<tr>
<td width="189" style="word-spacing: 0; border-right: 2px solid #FFFFFF; margin: 0">
<INPUT TYPE="radio" NAME="gender" value="John"> John<br>
<INPUT TYPE="radio" NAME="gender" value="Josh"> Josh<br>
<INPUT TYPE="radio" NAME="gender" value="KatyBeth"> KatyBeth<br>
<INPUT TYPE="radio" NAME="gender" value="Johnny & Hazel"> Johnny & Hazel<br>
<INPUT TYPE="radio" NAME="gender" value="Sarah"> Sarah<br>
<INPUT TYPE="radio" NAME="gender" value="NoNoBite"> NoNoBite<br>
<INPUT TYPE="radio" NAME="gender" value="Banana"> Banana<br>
<INPUT TYPE="radio" NAME="gender" value="Grassy & Sally"> Grassy & Sally<br>
<br>
<br>
</p>
<td width="48%" style="word-spacing: 0; border-left: 2px solid #FFFFFF; margin: 0" valign="top" align="center">
<p style="margin-top: 0pt; margin-bottom: 0pt;"><font color="#000000">
<INPUT TYPE="button" value="John" name="Segments" title="Click Here to select this Friend;"
onClick="segement(this.form);"
onMouseOver="window.status='Click Here to select this Friend';
return true;"
style="word-spacing: 0; border: 1px solid #0066FF; margin: 0; background-color: #0066FF"></font> </p>
Khalid Ali
07-09-2003, 11:09 AM
There is a tonne of errors in your code see the updated code below
function segement(frm) {
parent.I3.location='seg1/actions.html';//if the parent exists and this code
parent.pix.location='images/John.jpg';//executes then the whole thing will work
parent.info.location='seg1/message/John.htm'
exercise(frm)
}
function getSelectedButton(buttonGroup){
for (var i = 0; i < buttonGroup.length; i++) {
if (buttonGroup[i].checked) {
return i
}
}
return 0
}
function exercise(frm) {
var i = getSelectedButton(frm.gender)
if (frm.gender[i].value != "John" ) {
alert("You have not choosen any Processor Emulation.")
}else if (frm.gender[i].value == "John") {
alert("You choosen " + frm.gender[i].value + ".")
window.open("images/John.jpg", "sub", "HEIGHT=200,WIDTH=200")
}
}
//-->
</SCRIPT>
</head>
<body style="word-spacing: 0; margin: 0; background-color: #0066FF;
vertical-align:top" link="#FFFFFF" vlink="#FFFF00" alink="#00FF00">
<table cellpadding="0" cellspacing="0" style="border-collapse: collapse; word-spacing: 0; margin: 0" width="346" id="AutoNumber2">
<tr>
<FORM METHOD=POST ENCTYPE="text/plain" onReset="return allowReset()" style="text-align: left; word-spacing: 0; margin: 0">
<td width="189" style="word-spacing: 0; border-left-width: 1; border-right: 2px solid #FFFFFF;border-top-width: 1; border-bottom: 2px solid #FFFFFF; margin: 0">
<p>
<b><font color="#FFFFFF">
<INPUT TYPE="reset" size="10" value="1. Characters" style="color: #FFFFFF;font-weight: bold;word-spacing: 0; margin: 0; background-color: #0066FF; width:183;height:0; position:relative; float:left; left:0; top:0;" title="Click here to clear Character;"
onMouseOver="window.status='Click here to clear Characters';return true;"
onClick="hardReload()"></font></b></td>
<td width="155" style="word-spacing: 0; border-left: 2px solid #FFFFFF;border-bottom: 2px solid #FFFFFF; margin: 0">
<p style="text-align: center"><b>
<a title="Click here to clear Friends;"
onMouseOver="window.status='Click here to clear Friends';return false;"
target="_top" href="index.html">2. Friends</a></b></td>
</tr>
<tr>
<td width="189" style="word-spacing: 0; border-right: 2px solid #FFFFFF; margin: 0">
<INPUT TYPE="radio" NAME="gender" value="John"> John<br>
<INPUT TYPE="radio" NAME="gender" value="Josh"> Josh<br>
<INPUT TYPE="radio" NAME="gender" value="KatyBeth"> KatyBeth<br>
<INPUT TYPE="radio" NAME="gender" value="Johnny & Hazel"> Johnny & Hazel<br>
<INPUT TYPE="radio" NAME="gender" value="Sarah"> Sarah<br>
<INPUT TYPE="radio" NAME="gender" value="NoNoBite"> NoNoBite<br>
<INPUT TYPE="radio" NAME="gender" value="Banana"> Banana<br>
<INPUT TYPE="radio" NAME="gender" value="Grassy & Sally"> Grassy & Sally<br>
<br>
<br>
</p>
<td width="48%" style="word-spacing: 0; border-left: 2px solid #FFFFFF; margin: 0" valign="top" align="center">
<p style="margin-top: 0pt; margin-bottom: 0pt;"><font color="#000000">
<INPUT TYPE="button" value="John" name="Segments" title="Click Here to select this Friend;"
onClick="segement(this.form);"
onMouseOver="window.status='Click Here to select this Friend';return true;"
style="word-spacing: 0; border: 1px solid #0066FF; margin: 0; background-color: #0066FF"></font> </p>
callwin
07-09-2003, 12:51 PM
The three parents window load with no problem then the 2nd function whould bave started but does not.
Cindy
Khalid Ali
07-09-2003, 12:55 PM
The code I posted above is tested so I am just wondering how comeits not working for you(implementation mistakes on your end???)
Upload the rest of code and pages which are directly related to this problem so that I can see what is it you are doing wrong.
(upload as zip file)
callwin
07-09-2003, 03:07 PM
The main file is called index.html
and the file that has the functions is called charc_friends.html
Thank-u
Cindy
Khalid Ali
07-09-2003, 03:23 PM
I am not sure if this is correct or not,but the exercise function is being called,among others the main problem you have is there is no loadFunc2 defined anywhere in the code and you are trying to call clearTime(loadFunc2) on it..
And there is no clearTime function as well..this is the beginning of errors..let me know what you get once you fix them
callwin
07-10-2003, 08:16 AM
I have added the setTimeout and still get the same problem as before. I have attach the two files.
Thanks
Khalid Ali
07-10-2003, 09:03 AM
You should correct the errors I pointed out above ...
callwin
07-10-2003, 01:25 PM
I thought I put all the changes back in and added the setTimeout since it was mention that the clearTime... was
in. How do I defined loadFunc2. Would it be better to take out the set Timeout and have the segement function call the exercise function? I have removed all and started over again with the two function being called as the following:
onClick="segment(this.frm); exercise(this.frm);"
Then put the exercise(this.frm) in the exercise fucntion as the last line
Then put onClick="segment(this.frm); var loadFunc2 = setTimeout('exercise(this.frm)' 500);" and added clearTimeou(loadFunc2)' in the exercise fucntion.
So far nothing has been working. What would be the best appoarch.
Would it be best to keep posting or email between each other?
Thanks