JavaScript - Function Loop Not Working, Looking For Alternatives

Hi Everyone,

I am not able to figure out why the function "changeDiv(the_div,the_change)" is not called from the for loop in the function displayUsers(keeper)that I generated. The displayUsers is written to get rid of excess code in the function display(keeper).

Can someone, please point out what the mistake is?


Code:

function changeDiv(the_div,the_change)
{
  var the_style = getStyleObject(the_div);
  if (the_style != false)
  {
    the_style.display = the_change;
  }
}



function getStyleObject(objectId)
{
  if (document.getElementById && document.getElementById(objectId)) {
    return document.getElementById(objectId).style;
  } else if (document.all && document.all(objectId)) {
    return document.all(objectId).style;
  } else {
    return false;
  }
}



//Shows input information for # of users selected 

function displayUsers(keeper)
{
  var display=keeper;
  var i,user;
  for(i=1;i<= display;i++)
   {
      user="user"+i;
      changeDiv('user','block');
    }
} 


/*function display(keeper)
{
  if (keeper == 1)
  {
    changeDiv('user1', 'block');
    changeDiv('user2', 'none');
    changeDiv('user3', 'none');
    changeDiv('user4', 'none');
    changeDiv('user5', 'none');
    changeDiv('user6', 'none');
    changeDiv('user7', 'none');
    changeDiv('user8', 'none');
    changeDiv('user9', 'none');
    changeDiv('user10','none');


  }
  else  if (keeper == 2)
  ...
  ...
  ...
else
  {
    changeDiv('user1', 'none');
    changeDiv('user2', 'none');
    changeDiv('user3', 'none');
    changeDiv('user4', 'none');
    changeDiv('user5', 'none'); 
    changeDiv('user6', 'none');
    changeDiv('user7', 'none');
    changeDiv('user8', 'none');
    changeDiv('user9', 'none');
    changeDiv('user10','none');
  }

}// end function display(keeper)*/

Hey,

I'm attempting to add functuallity to some code and have been having problems getting loops to create variables that are usable. I know the actual programming seems rather redundant as im creating a variable for each div then looping it to create each div, but it is the only way i can get it to work with other parts of the website.

So the actual code takes the variables defining the content of each div and uses the loop to actually produce the divs. I am having problems with the + "linkdiv" + x + part of the actual loop. however way i try to define the variable it simply prints the "linkdiv1" or "linkdiv2" ect... rather then referencing the earlier variable that was created and printing "div1". is this even possible in javascript? The whole whing works when i reference a variable directly, just not when i try to use a loop to create the reference for me. If i use a variable directly i get 5 of the same references rather than one of each reference which is not what i want.

please note thati define the colour1 and colour2 variables along with the rest of the actual code earlier in the function...

Code:

var linkdiv1="<p style=\"color:"+ colour1+"\">div1</p>"

var linkdiv2="<p style=\"color:"+ colour1+"\">div2</p>"

var linkdiv3="<p style=\"color:"+ colour1+"\">div3</p>"

var linkdiv4="<p style=\"color:"+ colour1+"\">div4</p>"

var linkdiv5="<p style=\"color:"+ colour1+"\">div5</p>"

<!----------------------------------------------------------------->
	
for (x = 1; x <= 5; x++)

{	

document.write("<div style=\""+colour1+"\" id=\"div"+x+"\">" + "linkdiv" + x + "</div>")

}

feel free to ask for more infomation or more code as im not even sure if this makes enough sense to answer the question. Having troubles writing this in a way thats easily understood as i had to take a lot of code that wasnt relevent out.

thanks...

hi
i'd like to ask how can i ask for a function inside a for loop , if i remove the loop the code works fine but i need it for 10 rows . please help , here is the code
PHP Code:
$content .='        <table cellspacing="2" cellpadding="2" border="0" 
    align="center" >

    <SCRIPT LANGUAGE="JavaScript" type="text/JavaScript">
    function doCalcAndSubmit() {
// get both values
kolicina1 = document.forms["vlez1"].kolicina.value;
cena1 = document.forms["vlez1"].cena.value;

// do some calculation
vkupno1 = kolicina1 * cena1;

// set the value in the right field
document.forms["vlez1"].vkupno.value = vkupno1;
}
</script>
    <form id="vlez1" name="vlez1" method="POST" action="index_execute.php" >
    
        <tr valign="middle">
            <td></td>
            <td align="center"><b> Sifra : </b></td>
            <td align="center"><b> Kolicina : </b></td>
            <td align="center"><b> Cena : </b></td>
            <td align="center"><b> Vkupno : </b></td>
        </tr>
            ';

        for($t=1;$t<11;$t++)    {

$content .= '    
        <tr valign="middle">
            <td>'.$t.'.</td>
            <td><input type="text" id="sifra" autocomplete="off" name="sifra['.$t.']" align="middle" onblur="normalField(this);" onfocus="fireKeyListener_sifra(event); highlightField(this,1);" onkeyup="getList_sifra(event);" size="25" value="" /></td>
            <td><input type="text" id="kolicina" name="kolicina['.$t.']" align="middle" size="25" ></td>
            <td><input type="text" id="cena" name="cena['.$t.']" align="middle" size="25" onblur="doCalcAndSubmit();"></td>    
            <td><input type="text" id="vkupno" disabled name="vkupno['.$t.']" align="middle" size="25" ></td>    
                <input type="hidden" name="hidden_data" value="'.$data.'">
                
        </tr>';    }

$content .= '<tr>
            <td></td>
            <td></td>
            <td align="center"><input type="submit" id="submit2" name="submit2"    value="Potvrdi" ></td>
        </tr>    
        
    </form>
    
    </table>
    '; 

I'm trying to make it so when you click a cell in a table it runs a function based on the value within that cell. With the current code, no matter what cell is clicked, the alert box displays the same number, which is the last number in my array. The variable, princ, is just being overwritten rather than writing code to each the cell with the proper value. Help is appreciated. Thanks.

Code:

for(i=0;i<=3;i++){
	document.writeln('<tr>');
	document.writeln('<th>'+(periodArray[i])+'</th>');
	for(j=0;j<=2;j++){
		princ = principleArray[j][i];
		document.writeln('<td onclick="(calculateInterest(princ,1,1))">$'+principleArray[j][i]+'</td>');
	}
	document.writeln('</tr>');
}

function calculateInterest(principle,rate,period){
	totalInterest = principle * rate * period;
	totalLoanCost = principle + totalInterest;
	alert('Total Interest: '+totalInterest+'\n'+'Total Loan Cost: '+totalLoanCost);
}

Hi,

I have a problem with my script, I have a php request and the result is shown in a div, so there is several divs and their id is the "id" in the database, and I want that if we click on a link, it hides every divs...


Here is how I tried to do that:

Code:

<script type="text/javascript">
function visibilite(thingId)
{
var targetElement;
targetElement = document.getElementById(thingId) ;
targetElement.innerHTML = "" ;
}
</script>

Code:

$hide = "";
while($ligne=mysql_fetch_array($ress)){


$hide.= "visibilite('$ligne[id]'); ";


$return.= "<tr><td>$ligne[heure] - $ligne[fin]</td><td>$ligne[sport]</td><td>$ligne[salle]</td><td>$ligne[ville]</td><td>$dispo/$ligne[place]</td><td><div id=$ligne[id]>";

$return.= "<a href=# onClick=\"maFonctionAjax($ligne[id],$tennis); $hide return false\">Reserver</a>";

$return.= "</div></td></tr>";
}

Every div'id is the id in the database, with the onClick we call an ajax function and $hide which is the call for the function visibilite for each div

It works for some request, I don't know how is it possible because I can have the same number of results and sometimes it works, and sometimes not...

Does somebody can help me?

Thanks a lot!

Jeff

I am trying to create a simple auto-calculate function for a webpage.

What should be happening:
The 'onchange' command should pass the 'price' of the item to the function, the function should then cycle through all the dropdowns (or checkboxes or fields) and calculate the total.

What is happening:
It is only picking up the last checkbox. It seems that the 'for' loop only remembers the last item in the array.

What am I doing wrong? How can I get the code to remember all the items?
thanks,

Code:

<script language="JavaScript" type="text/javascript">

function calculateTotal(price)
{
	var total = 0;	
	var cList = ['sel1','sel2','sel3'];	
	for (i=0;i<2;i++); 
	var select = GetE(cList[i]); total+= price * (select.options[select.selectedIndex].value); 	
	GetE("totalShow").innerHTML = total.toFixed(2);		
}

function GetE(id) {return document.getElementById(id); }
</script>

<html>
<head></head><body>
<form id="form1" name="form1" method="post" action="">

    <select name="sel1" id="sel1" onchange="calculateTotal(100)">
        <option value="0">0</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
    </select><br><br>
     <select name="sel2" id="sel2" onchange="calculateTotal(200)">
             <option value="0">0</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
    </select><br><br>
     <select name="sel3" id="sel3" onchange="calculateTotal(300)">
        <option value="0">0</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
    </select><br><br>
  </form>
<br>total <span id="totalShow">0.00</span>
</body></html>

Hello again,

I've continued to study and work on JavaScript. I've had some problems with the document.write() function. When I try to do a math problem, the whole content of the page clears out and only displays the solution. For example:
Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
function jahava()
  {
	var h = 1
var r = 4
var t = 5
document.write(h += r += t)
	}
	
</script>
</head>
<body>
<button OnClick="jahava()">Click Me!</button>
</body>
</html>

So If I put other content, like the button I was displaying (which I wanted to stay visible), the function would make them all disappear. I would again appreciate any help towards this matter.

Sincerely,
Taro B.

PS; This is not a calculator related problem, just in-general.

Hi Guys,
I am a novice at javascript. I possibly need an alternative to document.write to output specifically the value contained in Code:

{exp:lg_ml:translate key="phrase[i]"}

This syntax is cms specific and carries a value like horse or a translated version of it like Pferd in German. The below code outputs:
{exp:lg_ml:translate key="cat"}{exp:lg_ml:translate key="dog"}{exp:lg_ml:translate key="horse"} but I want it to output in the source code of my template so it can execute correctly with predetermined values and not just on screen as the syntax instead of the actual value it holds, if you know what I mean.

Anyway after hours of trying and 5 cups of cheap Nescafe coffee I need to achieve exactly the below with an alternative possibly to document.write? I also need to keep the loop.
Thanks

Code:

<html>
<body>

<script type="text/javascript">
var i;
var phrase = new Array();
phrase[0] = "cat";
phrase[1] = "dog";
phrase[2] = "horse";

for (i=0;i<phrase.length;i++)
{
document.write("{exp:lg_ml:translate key=\""+phrase[i] +"\"}");
}
</script>

</body>
</html>

As it is, I'm using Walter Zorn's JS Graphics Library in an attempt to write a small screensaver-type-thing for jailbroken iPhones/iPod touches. However, on my mom's AMD Athlon 64 3000+, the drawing gets pretty laggy, so you can imagine how utterly choppy it is on my iPod. The look I'm going for is the Windows XP Mystify screen saver, with corners bouncing around the screen. So, my first question is this: are there any alternatives for this sort of thing, short of manually generating a video, gif, or multiple images to switch through, or is there any way to make my code more efficient for the CPU? (Code below)

NOTE: I know I could make it look a lot nicer by making a 'corner' class, and having each corner be an object (and even nicer by using an array of 'corners'). But I'm not sure that would help the CPU's calculations much, and make the code more efficient as a whole.

Code:

<div id="Mystify">
			<script type="text/javascript">
				var mystifyCanvas = new jsGraphics("Mystify");
				
				var tetraCorner1x = Math.floor(Math.random()*300) + 5;
				var tetraCorner1y = Math.floor(Math.random()*460) + 5;
				var tetraCorner2x = Math.floor(Math.random()*300) + 5;
				var tetraCorner2y = Math.floor(Math.random()*460) + 5;
				var tetraCorner3x = Math.floor(Math.random()*300) + 5;
				var tetraCorner3y = Math.floor(Math.random()*460) + 5;
				var tetraCorner4x = Math.floor(Math.random()*300) + 5;
				var tetraCorner4y = Math.floor(Math.random()*460) + 5;
				
				go1x = true;
				go1y = false;
				go2x = true;
				go2y = true;
				go3x = false;
				go3y = true;
				go4x = false;
				go4y = false;
				
				function MystifyJavaScript()
				{
					mystifyCanvas.clear();
					mystifyCanvas.setColor("#ff0000");
					mystifyCanvas.setStroke(2);
					
					if (go1x)
					{
						tetraCorner1x++;
						
						if (tetraCorner1x > 315)
						{
							go1x = false
						}
					}
					else
					{
						tetraCorner1x--;
						
						if (tetraCorner1x < 5)
						{
							go1x = true
						}
					}
					if (go1y)
					{
						tetraCorner1y++;
						
						if (tetraCorner1y > 475)
						{
							go1y = false
						}
					}
					else
					{
						tetraCorner1y--;
						
						if (tetraCorner1y < 5)
						{
							go1y = true
						}
					}
					
					
					
					if (go2x)
					{
						tetraCorner2x++;
						
						if (tetraCorner2x > 315)
						{
							go2x = false
						}
					}
					else
					{
						tetraCorner2x--;
						
						if (tetraCorner2x < 5)
						{
							go2x = true
						}
					}
					if (go2y)
					{
						tetraCorner2y++;
						
						if (tetraCorner2y > 475)
						{
							go2y = false
						}
					}
					else
					{
						tetraCorner2y--;
						
						if (tetraCorner2y < 5)
						{
							go2y = true
						}
					}
					
					
					
					if (go3x)
					{
						tetraCorner3x++;
						
						if (tetraCorner3x > 315)
						{
							go3x = false
						}
					}
					else
					{
						tetraCorner3x--;
						
						if (tetraCorner3x < 5)
						{
							go3x = true
						}
					}
					if (go3y)
					{
						tetraCorner3y++;
						
						if (tetraCorner3y > 475)
						{
							go3y = false
						}
					}
					else
					{
						tetraCorner3y--;
						
						if (tetraCorner3y < 5)
						{
							go3y = true
						}
					}
					
					
					
					if (go4x)
					{
						tetraCorner4x++;
						
						if (tetraCorner4x > 315)
						{
							go4x = false
						}
					}
					else
					{
						tetraCorner4x--;
						
						if (tetraCorner4x < 5)
						{
							go4x = true
						}
					}
					if (go4y)
					{
						tetraCorner4y++;
						
						if (tetraCorner4y > 475)
						{
							go4y = false
						}
					}
					else
					{
						tetraCorner4y--;
						
						if (tetraCorner4y < 5)
						{
							go4y = true
						}
					}
					
					
					
					mystifyCanvas.drawLine(tetraCorner1x, tetraCorner1y, tetraCorner2x, tetraCorner2y);
					mystifyCanvas.drawLine(tetraCorner2x, tetraCorner2y, tetraCorner3x, tetraCorner3y);
					mystifyCanvas.drawLine(tetraCorner3x, tetraCorner3y, tetraCorner4x, tetraCorner4y);
					mystifyCanvas.drawLine(tetraCorner4x, tetraCorner4y, tetraCorner1x, tetraCorner1y);
					
					mystifyCanvas.paint();
					window.setTimeout("MystifyJavaScript()", 10);
				}
				
				MystifyJavaScript();
			</script>
		</div>

Please keep in mind, there's a LOT of repeat code, so you only have to read any one part once. To test/see/use the code, you'll need to download wz_graphics.zip. Then download the attached txt file to the same directory as the unzipped wz_graphics, change it to .html instead of .txt, and open it.

Hi,
I'm newer than a newbie. I wrote a website in html, which has an ecommerce that sends the purchase to paypal. My client wants to offer a coupon. I found code in javascript that validates the coupon, but I want to be able to tell PayPal the discounted amount as this discount will not apply to all customers.

PayPal Merchant Services told me that I can not use a variable in the following line:
<input name="amount" type="hidden" value="132" />

Is there a way I can use Javascript to do the following? At this time, this code doesn't give me an error, but it doesn't send the amount to PayPal either.

<script language="javascript">function validate(text1,text2) {
if (text1 == text2)
{ document.write('<input name="amount" type="hidden" value="0" />')
}
if (text1 !== text2)
{ document.write('<input name="amount" type="hidden" value="125" />')
}}
</script>

Thanks for any help.

Hello, I am new to this forum stuff so please bear with me.
This is the code I am using.
Code:

<script type="text/javascript">
	function ReadForm(obj1) {
        "use strict";
		var amt = obj1.amount.value;
		obj1.amount.value = amt - (amt / 6.6);
	}
</script>

The value (obj1) is 99
It is supposed to return a value of 84 and I keep getting 99
DId I do something wrong ?

Hi,

What I did is not working. Using coldfusion. Have cfselect object (id="Decision") with 3 values - Select; Approved; Denied.
Have two input buttons, Request Approved (id="approved") and Request Denied (id="denied").
The Approved is visible but disabled. The Denied is not visible.
The user needs to select from "Decision" either Approved or Denied before he/she can submit. So when user selects Approved from drop-down I want to enable Request Approved submit button. If user selects Denied from drop-down I want the disabled Request Approved button to not be visible and the Request Denied button to be visible and enabled for submission. The respective buttons will be directed to their appropriate actions.

Code:

<script type="text/javascript">
var decide = function() {
	var choice = document.getElementById("Decision");
	var apprvd = document.getElementById("approved");
	var deny = document.getElementById("denied");
	
	if (choice.value == "Approved")
	{
		deny.style.disabled = "disabled";
		deny.style.visibility = "hidden";
		apprvd.style.disabled = false;
		apprvd.style.visibility = "visible";
	}
	if (choice.value == "Denied")
	{
		apprvd.style.disabled = "disabled";
		apprvd.style.visibility = "hidden";
		deny.style.disabled = false;
		deny.style.visibility = "visible";
	}
	}
</script>

Nothing happens - any suggestions why not?

Thanks - John

I am having trouble getting my function to work

here is what I have so far

Code:

<script type="text/javascript"> // script element to add the votes.js

function totalVotes(votes1){ // script element that will calculate the array
 ****var total = 0;
 ****for (var i = 0; i < votes1.length; i++) {
 *******total = total + votes1[i];
 ****}
 ****return total;
}
</script>

Can anyone see whats wrong?
when i run it i still get nothing

OK so I am trying to put the following output together

2: 2
3: 3
4: 2,4
5: 5
6: 2,3,6
7: 7
8: 2,4,8
9: 3,9
10: 2,5,10

So I am looking for factors of numbers. User inputs a minimum and maximum and the function runs until it hits the max number. In between it is going to write out all of the factors for each line number.

Here is function so far and it is NOT working

function allFactors(num1,num2,outputDiv){
var min = parseInt(document.getElementById(num1).value);
var max = parseInt(document.getElementById(num2).value);
var output = "";
var start = 2;

for (var i = 1; i <= max; ++i) {
output += i+":"
if (min/start == Math.round(min/start)){
output += start
}
else {
++start
}
}"<br />"

addToDiv(outputDiv, output);
}