JavaScript - Nested Javascript Array

Hi all! I'm pretty new to JavaScript and completely new to this forum. I'm James.

Well uh, I'm not sure how to...

I wanted to make something like this using javascript...

Code:

myObject.someMethod('something').anotherProperty

much like the

Code:

document.getElementById('someId').style.morestuff

But the thing is, I've been around every DOM whatnot I can find, I just can't seem to make it work.

I kinda need it to make my own DOM for some API i'm writing. So I can write like...

Code:

function someGreatAPI(){
     this.property1='';
     this.property2='';
     //...
     this.method1 = function(var1){            //this should make my firstMethod
           this.nestedProperty = 0;
           this.nestedMethod = someFunction;  //firstMethods nested method

     }
}

//so I can use it like...

var obj = new someGreatAPI();
obj.method1(10).nestedMethod();

It has to be possible, it's possible with document.getelementbyid, right? it has to be.

Thanks in advance.

I am working on a page where the user will select a location from a dynamically generated dropdown list.

I was able to create the php multidimensional array (tested and working) from a MySql database using the users information at login, but I'm having problems converting it to a javascript multidimensional array. I need to be able to access variables that I can pass to a number of text fields within an html form.

For instance, if a user belongs to a company with multiple addresses, I need to be able to let them select the address they need to prepopulate specific text fields.

php array creation:
Code:

if ($row_locations) 
{ 
	while ($row_locations = mysql_fetch_assoc($locations))  
	{ 
		$mail[$row_locations['comp_id']]=array('mailto'=>$row_locations['mailto'], 'madd'=>$row_locations['madd'], 'madd2'=>$row_locations['madd2'], 'mcity'=>$row_locations['mcity'], 'mstate'=>$row_locations['mstate'], 'mzip'=>$row_locations['mzip'], 'billto'=>$row_locations['billto'], 'badd'=>$row_locations['badd'], 'badd2'=>$row_locations['badd2'], 'bcity'=>$row_locations['bcity'], 'bstate'=>$row_locations['bstate'], 'bzip'=>$row_locations['bzip']);
	} 
}

javascript function - this should create the array and send variables to text fields.
Code:

function updateAddress() {
var mail = $.parseJSON(<?php print json_encode(json_encode($mail)); ?>);
{
if (comp_id in mail) {
document.getElementById('mailto').value=mail.comp_id.mailto.value;
document.getElementById('madd').value=mail.comp_id.madd.value;
document.getElementById('madd2').value=mail.comp_id.madd2.value;
document.getElementById('mcity').value=mail.comp_id.mcity.value;
document.getElementById('mstate').value=mail.comp_id.mstate.value;
document.getElementById('mzip').value=mail.comp_id.mzip.value;
} else {
document.getElementById('mailto').value='';
document.getElementById('madd').value='';
document.getElementById('madd2').value='';
document.getElementById('mcity').value='';
document.getElementById('mstate').value='';
document.getElementById('mzip').value='';
}
}
}

Where is this breaking?
Thanks in advance.

I'm writing a program that involves a network of interconnected nodes (or simply objects in my example below). It depends on being able to access properties of an object's linked objects (a bit oddly worded, sorry)...

Problem is I'm not sure how to properly access those properties... see below please.

<script>

//This is an example of a problem im having in my own code...
//I want to access the name of the object within the links array wintin the object...

var objA = {name: "Object A", links: [objB, objC]};
var objB = {name: "Object B", links: [objC, objD, objE]};
var objC = {name: "Object C", links: [objB]};
var objD = {name: "Object D", links: [objE]};
var objE = {name: "Object E", links: [objD]};

//ex: I want to access the name of Object A's first link...
console.log(objA.links[0].name);

</script>

I'm hoping to get "Object B"...
But instead I get: TypeError: Result of expression 'objA.links[0]' [undefined] is not an object.
Is there another way around this? Any thoughts are appreciated.

Hi,
In a nutshell,can anyone tell me how to copy a 2d (two dimensional ,2 dimensional) php array to 2d javascript array?I would be obliged if anyone can provide me a method of doing that

OR
I have written a code to copy a 2d php array to a 2d javascript array.It is working but there is one problem(please see the following).Can anyone tell me what I am doing wrong here?


The 2d php array is $quest[100][6] and the 2d javascript array is questions[100][6] . I have written the javascript code inside the <?php....?> itself using echo "<script language="javascript" type="text/javascript">.......</script>;




Now ,inside the javascript,when I try to copy the 2d php array to the 2d javascript array using the following method it works

questions[0]= ["<?php echo join("\", \"", $quest[0]); ?>"];
questions[1]= ["<?php echo join("\", \"", $quest[1]); ?>"]; ... and so on


However, if I try to do the same using the following method it does not work
for (var i= 0; i <= 99; i++)
{ questions[i]= ["<?php echo join("\", \"", $quest[i]); ?>"]; }

Why is that?What mistake am I making?Any help will be deeply appreciated.Thanks



-----------------------------THE CODE------------------------------------
<?php


Access database and store result of mysq_query in $result.......
$result = mysql_query($query);


for ( $count = 0; $count <= 99; $count++)
{
$quest[$count]=mysql_fetch_array($result,MYSQL_NUM);;

}

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

var questions = new Array(100);
for (var i = 0; i <100; i++)
{ questions[i] = new Array(6); }



/*The following method of copying 2d php array to 2d javascript array is not working
for ( var i = 0; i <= 99; i++)
{ questions[i]= ["<?php echo join("\", \"", $quest[i]); ?>"]; }
*/

/*The following method ,however,is working*/
questions[0]= ["<?php echo join("\", \"", $quest[0]); ?>"];
questions[1] = ["<?php echo join("\", \"",$quest[1]); ?>"];
questions[2] = ["<?php echo join("\", \"",$quest[2]); ?>"]; ....and so on




</script>";


mysql_close($db_server);

?>

Hi,
Here is a working code to copy 2d php array to 2d javascript array.


Code:

<html>

<head>

<?php

for($i = 0; $i < 3; $i++)
 {
   for($j = 0; $j < 2; $j++)
                   {$quest[$i][$j] = $i*10+$j;}
 }


?>



<script type="text/javascript">


var questions = new Array(3);

  for (var i = 0; i < 3; i++)
  {
   questions[i] = new Array(2);
  }

questions[0] = ["<?php echo join("\", \"", $quest[0]); ?>"];
questions[1] = ["<?php echo join("\", \"", $quest[1]); ?>"];
questions[2] = ["<?php echo join("\", \"", $quest[2]); ?>"];



document.write(questions[0][0] + "<br />");
document.write(questions[0][1] + "<br />");
document.write(questions[1][0] + "<br />");
document.write(questions[1][1] + "<br />");
document.write(questions[2][0] + "<br />");
document.write(questions[2][1] + "<br />");


</script>




</head>

</html>

Now,here's the thing.Notice these lines in the code


questions[0] = ["<?php echo join("\", \"", $quest[0]); ?>"];
questions[1] = ["<?php echo join("\", \"", $quest[1]); ?>"];
questions[2] = ["<?php echo join("\", \"", $quest[2]); ?>"];

I would like to put these lines in a loop,something like

for (var i = 0; i < 3; i++)
{
questions[i] = ["<?php echo join("\", \"", $quest[i]); ?>"];
}

But even after a lot of efforts I am unable to do so,what am I doing wrong?Thanks

Hi,
i can't find the mistake in my little script hope someone can help me.

PHP Code:
<?php

/* -------------------- read thumbfolder -------------------- */
    
    function isRdyPfD($filename){ 

        if ($filename == '.' || $filename == '..') {
        // To-Top-Dir
        return false;
    }
    
    $ext = explode(".",$filename);
    $ext = $ext[sizeof($ext) - 1];
    $allowedformats = array (
        'jpg', 
        'png',
        'jpeg',
        'gif'
    );
    
    return in_array($ext,$allowedformats);
    } 

    function getPicsfromDir($dir){ 
    /* array with names of the pictures in  $dir */

        if (is_dir($dir)) {
        if ($dh = opendir($dir)) {
                $filearray = array();
        while (($file = readdir($dh)) !== false) {
            if (isRdyPfD($file) === true) {
                $filearray[] = $file;
            }
        }
        closedir($dh);
                return $filearray;
        }
    }
    else {
        return false;
    }
    } // End Function


    $thumbs = getPicsfromDir("./images/thumbs/");
    

/* -------------------- thumbfolder  -------------------- */    
    echo "<div id='thumbslider'>\n";
    echo "<ul id='thumbs'>\n";
    for($i = 0; $i < count($thumbs); $i++){
            echo "<li><img src=\"./images/thumbs/$thumbs[$i]\" onclick=\"thumbClick($i)\"  /></li>\n";
            
    }
    echo "</ul>\n";
    echo "</div>\n";
    




/* -------------------- big size images folder -------------------- */
    $bigSizeImages = getPicsfromDir("./images/");
    //print_r($bigSizeImages);
    
    $jsValue = '';
    for ($j=0; $j < count($bigSizeImages); $j++){
                $jsValue = $jsValue . $bigSizeImages[$j];
                if ($j < (count($bigSizeImages)-1)) {
                        $jsValue = $jsValue . ",";
                }
   }
    
?> 


<script type="text/javascript">
        images = new Array(<?php echo $jsValue ?>);
        
    

    
    
    function thumbClick(pos){
            
            //alert(pos);
            alert(images[pos]);
            
    }

</script>

I can't trace the images array values?
thanks for a feedback!!!

Hello I'm have some javascript objects with arrays that should be transferred as php array.
Its posted by ajax httpRequest.

How can I return php array, from the javascript?


JS Code:

['asd1', 'asd2', 'asd3']

via Ajax

=> PHP PHP Code:
array('asd1', 'asd2', 'asd3'); 

PLEASE help me with this I have no hair left!
Thanks a million, RHonda


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#container {
background-color:#FFFF99;
width:90%;
}
#header {
background-color: #FFFF99;
}
#topNav {
background-color: #FFFF99;
}
#content {
background-color: #FFFF99;
width:70%;
float:left;
}
#displayCart {
background-color:#9CC;
width:28%;
float:right;
}
#footer {
background-color: #FFFF99;
clear:both;
}
</style>
</head>

<body>
<div id="container">
<div id="header">
<h2 align="center">WDV221 Project 11 </h2>
<h2 align="center">Arrays Part 3</h2>
</div>
<div id="topNav">
<div align="center">
<table width="80%" border="0">
<tr>
<td>Home</td>
<td>Products</td>
<td>Services</td>
<td>About</td>
</tr>
</table>
</div>
</div>
<div id="content">
<div align="center">
<h3>Available Product Selection
</h3>
<table width="80%" border="0">
<tr>
<td><div align="center">Pencils</div></td>
<td><div align="center">Pens</div></td>
<td><div align="center">Scissors</div></td>
<td><div align="center">Markers</div></td>
<td><div align="center">Stapler</div></td>
<td><div align="center">Coffee Cup</div></td>
</tr>
<tr>
<td><div align="center">$.45</div></td>
<td><div align="center">$1.19</div></td>
<td><div align="center">$8.95</div></td>
<td><div align="center">$4.88</div></td>
<td><div align="center">$12.97</div></td>
<td><div align="center">$3.00</div></td>
</tr>
<tr>
<td><div align="center">
<input name="" type="button" value="Add to Cart" />
</div></td>
<td><div align="center">
<input name="" type="button" value="Add to Cart" />
</div></td>
<td><div align="center">
<input name="" type="button" value="Add to Cart" />
</div></td>
<td><div align="center">
<input name="" type="button" value="Add to Cart" />
</div></td>
<td><div align="center">
<input name="" type="button" value="Add to Cart" />
</div></td>
<td><div align="center">
<input name="" type="button" value="Add to Cart" />
</div></td>
</tr>
</table>
<p><input name="" type="button" value="Display Cart" /></p>
<p><input name="" type="button" value="Remove Item From Cart" /></p>
</div>
<h2>Instructions</h2>
<p> This project will build a Javascript base shopping cart. The scripts will add product and price to a pair of parallel arrays. It will allow the user to view the shopping cart elements, shopping cart totals and remove elements from the shopping cart. </p>

<p>For purposes of this exercise we will limit the shopping cart to a maximum of 5 items. Once it has reached five items the Add a Product function will no longer allow you to add products. </p>
<ol>
<li>Create two parallel arrays called productName productPrice. The arrays<br />
should only allow for five rows. <br />
<br />
</li>
<li>Build a function that will add the product name and product price to a row in their respective arrays. This function will activate on the Add to Cart buttons.<br />
<br />
<strong>Note</strong>: This is a great opportunity to make this a generic function and pass the product name and price into the function as parameters. The<br />
function would use the two parameters to lookup the product and<br />
place the price in the corresponding row.<br />
<strong>example</strong>: onclick=&quot;addToCart(&quot;<em>product</em>&quot;,<em>price</em>)<br />
<br />
<strong>HINT</strong>: Keeping track of the rows is best done with a global variable. <br />
<strong>Note</strong>: Duplicate rows are allowed. <br />
<strong>Example</strong>: productName[0] and productName[2] could both contain<br />
Stapler. <br />
</li>
<li>Build a function to display the arrays in the Shopping Cart area. This will run when the Display Cart button is clicked. It will also provide a total of the product prices. The total should be formatted as currency.<br />
<strong>Hint</strong>: Use &lt;p&gt; and .innerHTML to build an area to display and clear</li>
<li>Build a function that will remove a product from the arrays. It will ask the user for the product name. The name should not be case sensitive. Remove the product and the corresponding price.</li>
<li>Build a function that will remove all the products and corresponding prices from the arrays. This will run when the Clear Cart button is clicked.</li>
</ol>
</div>
<div id="displayCart">
<h4 align="center">Shopping Cart</h4>
<h4 align="center">List of Products</h4>
<p align="center"><input name="" type="button" value="Clear Cart" /></p>
<p>Today is: Month/dd/yyyy</p>

</div>
<div id="footer">Place today's date he (Day, Month date, year) ex: Monday January 1, 2012</div>
</div>
</body>
</html>

Hello hello,

I have a javascript array to load a different picture each time a page loads up. The code is as follows:



<script type="text/javascript">
var imageArray = new Array();

imageArray[0] = "images/animation9.gif";
imageArray[1] = "images/Title2.gif";
imageArray[2] = "images/animation4.gif";

function doIt()
{
var rand = Math.floor(Math.random()*3);
var imgPath = "<img src='"+imageArray[rand]+"' alt='Welcome' border='0' align='absmiddle' />";
document.getElementById("image").innerHTML = imgPath;
}
</script>




So...it works fine with .gifs, but how would I get it to work with .swf movies too?

I've tried just putting the .swf in there e.g. ...

'imageArray[2] = "images/animation6.swf";

But that doesn't seem to work.

Any ideas?

Thank-you SO much in advance.

Hi guys,

I am new to JavaScript and was wonder how I would go about creating a form to allow the user to enter various words, one at a time.

These words are added to an array and displayed in the page using the textarea form element.

Each time a new word is entered, it is added to the array, and then the array is sorted in alphabetical order before the words in the array are displayed in the textarea, one per line.

I have tried lots and lots of different methods to accomplish this, and I can get it half working when I use the alert function, but I need this to display on the page in a textarea rather than in an alert box, I tried to get it to write to the page using a document.write function, but like I said i am new to JavaScript and unfortunately cant get any of it working.

Code:
Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JavaScript Page One</title>
</head>
<BODY>

<CENTER>
<FORM name="history">

<INPUT name="command" type="text" value="">
<INPUT type="button" value="Add to List" onclick="f_store(document.history.command.value)">
<INPUT name="history" type="button" value="Show List" onclick="f_print()">
</FORM>
<P>
<SCRIPT language="JavaScript">
function MakeArray( n ) {
if( n <= 0 ) {
this.length = 0;
return this;
}
this.length = n;
for( var i = 1; i <= n; i++ ) {
this[ i ] = 0;
}
return this;
}
var history = new MakeArray( 15 );
var index = 0;
var cmmnd = 1;
function f_store( sTR ) {
var i;
if( index >= history.length ) {
for( i = 1; i < history.length; i++ )
history[i-1] = history[i];
index = history.length - 1;
}
history[ index ] = cmmnd + ":" + sTR;
++cmmnd;
++index;
document.history.command.value="";
}
function f_print() {
var allCmmnds, i;
allCmmnds = "";
for( i = 0; i < index; i++ )
allCmmnds += history[i] + "\n";

alert( allCmmnds );
}
</SCRIPT>
</body>
</html>

If someone could please help me by posting some relevant code that would accomplish this, I would greatly appreciate it, as so far I have been scratching my head for a few hours.

Thanks,

~Savage

Hi,

Can anyone help me with this question? I have a JavaScript page to place a track to a google maps. I want the array of points to be shown to come from PHP. However, there are (probably a lot) of errors in it that makes it doesn't work.

My main page code:


xmlhttpT=new XMLHttpRequest();
//var MyRouteC = "";



xmlhttpT.open("GET","getRoute.php",true);
//var MyRouteC= (array)xmlhttpT.responseText;
var MyRouteC = (array)xmlhttpT.responseText);

xmlhttpT.onreadystatechange=function()
{
if (xmlhttpT.readyState==4)
{
//MyRouteC = xmlhttpT.responseText;
alert(xmlhttpT.responseText);
}
}
xmlhttp.send();

var MyRoute = new google.maps.Polyline({
path: MyRouteC,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2 });

MyRoute.setMap(map);

The page it is calling is a php page:
PHP Code:
<?php
$con = mysql_connect("xxxxx.mysql","xxxxxxxxxxx","xxxxxxxxx");
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }
mysql_select_db("letsmeet_mobi", $con);
$query = "SELECT * FROM CurrentLocation ORDER BY time DESC LIMIT 0 , 5";
mysql_query($query);
$result = mysql_query($query);

while($row = mysql_fetch_array($result))
  {
  $output = $output .  " new google.maps.LatLng(".$row['gpslat'].", ".$row['gpslong']."), ";
  }


echo $output;
mysql_close($con);
?>

The php data connection works fine, and it results in a string that looks exactly like the way I want the value to be passed to the JavaScript.

Any help is welcome!

Hi guys I was wondering if its possible to add contents within a div to a javascript array. Something like this:
Code:

<script type="text/javascript">
function returnArray()
{
    var divContent   = document.getElementById('images');
    var matchImage = divContent.match(/<img/);
    /* add images into array somehow */
    alert('This is ' +ImageArray[1]);

}
</script>

<div id="images">
         <img src="image1.jpg" alt="image" />
         <img src="image2.jpg" alt="image" />
         <img src="image3.jpg" alt="image" />
</div>

Thanks for any info.

Hello,

I have just started learning JavaScript, so I do not know much about it at this moment. I need some help regarding validation of input values which are actually in an array.

Okay, my HTML looks like this:
Code:

Link# 1: <input name="url[]" size="80" type="text">
Title# 1:<input name="title[]" size="80" type="text">

Link# 2: <input name="url[]" size="80" type="text">
Title# 2:<input name="title[]" size="80" type="text">

Link# 3: <input name="url[]" size="80" type="text">
Title# 3:<input name="title[]" size="80" type="text">

.
.
.
.
.

And so on. (up to 20)

User can add more input fields by adding "Add" button; I'm using JavaScript for that purpose. By default, only a couple of fields is shown.

I want to validate these all fields using a loop or a number of loops, such that an alert appears if any field is left blank and also if any value in title[] array matches another value in that array and same for the second array url[]

Examples of working would be something like this:

Code:

If Link# 1 is left blank: alert("Link# 1 is empty");
or
If Link# 2 is left blank: alert("Link# 2 is empty");
or
If Title# 1 is left blank: alert("Title# 1 is empty");
or
If Title# 2 is left blank: alert("Title# 2 is empty");
or
If Link# 1 == Link# 2: alert("Link# 1 is same as Link#2");
or
If Link# 1 == Link# 3: alert("Link# 1 is same as Link#2");
or
If Title# 1 == Title# 3: alert("Title# 1 is same as Title#3");

etc, etc.

Any help would be appreciated.

Thank you.

Hi all,

this is my first post to this great useful forum.

I have a javascript 2d array [x,y] that contains integer values like this:

[0,0], [0,1], [0,2], [0,3],
[1,0], [1,1], [1,2],
[2,0], [2,1], [2,2],
[0,-1], [0,-2], [0,-3],
[1,-1], [1,-2],
[2,-3]

my question is how to get the max,min y value for each x.
for the sample above it should give me another array with the following results
[0,3],[0,-3],[1,2],[1,-2],[2,2],[2,-3]

your help is highly appreciated

Regards
Omran

Forgive me if the code is rather bad, I am new to Javascript.

Now what I'm aiming to do is after I have entered the contents of the Array's I then want to query the newly created array/database, based on the track number, Via a seprate function.

However all the values I entered, always come up empty.

No matter how many solutions I tried I can't get the query to work. So I've decided to come to you guys/gals for help.

Code:

mainMenu()

function mainMenu()
{
	menu = 0;
	menu  = eval(prompt("Select an Operation to Continue\n ====================\n 1 - Create new Database\n 2 - Query Database\n 3 - Show Report\n Any other to exit"));
	switch (menu)
	{
		case 1:
		insert(trackNumber)
		break;

		case 2:
		query(trackNumber)
		break;
	
		case 3:
		break;
	}
}

// Enter the track number
function trackNumber()
{
	var theNumber = eval(prompt("Enter Track Number"));
	if ((theNumber >= 0) && (theNumber < 100))
	{
		return theNumber; // Stores the track number for insert(trackNumber)
	}
}

// This function will allow the user via the (trackNumber)
// parameter to insert the contents of the database
function insert(trackNumber)
{
	// Create new Array's
	trackNum = new Array(5)
	trackName = new Array(5)
	trackArtist = new Array(5)
	
	// For each Track we want to hold the trackNumber(), 
	// the track name and the track's artist.
	for(var i = 0; i < trackNum.length; i++)
	{
		trackNum[i] = trackNumber()
		trackName[i]= prompt("Enter Track Name: " + i)
		trackArtist[i] = prompt("Enter Track Artist: " + i)
	}
}

// This Function will allow the user to query the database, based on track number.
function query(trackNumber)
{
	var trackSearch = trackNumber()
	var j = 0;

	for(j in query)
	{
		if (query[j] == trackSearch)
		{
			alert("Track Number: " + trackSearch + "\nTrack Name: " + trackName[j] + "\nTrack Artist " + trackArtist[j]);
			break;
		} 
		else if (query[j] != trackSearch)
		{
			alert("Track Number: Empty" +  "\nTrack Name: Empty" + "\nTrack Artist: Empty");
			break;
		} 
	}
}

If someone could please help me by posting some relevant code that would help accomplish this, I would greatly appreciate it, as so far I have been scratching my head puzzled, at how I could solve this.