Entry
JavaScript:Database:Simple: How to create many to many relation database using arrays in JavaScript?
Sep 12th, 2004 05:46
Knud van Eeden,
----------------------------------------------------------------------
--- Knud van Eeden --- 12 September 2004 - 01:52 am ------------------
JavaScript:Database:Simple: How to create many to many relation
database using arrays in JavaScript?
---
You could use an array with pointers to another array.
---
Steps: Overview:
1. -Create 2 arrays
1. The first array has minimally 2 columns,
(one extra column [key] which contains a number referring to
the corresponding row number of array 2)
2. The second array has minimally 2 columns,
(one extra column [key] which contains a number referring to
the corresponding row number of array 1)
---
---
array 1 array 2
------------------------- --------------------------
[nr] [description] [key] [nr] [description] [key]
------------------------- --------------------------
1 A 4 1 a 4
2 B 2 2 b 2
3 C 1 3 c 1
4 D 3 4 d 3
... 5 e 3
6 f 3
...
---
---
In JavaScript:
Steps: Worked out:
1. -Create 2 arrays
1. The first array has minimally 2 columns,
(one extra column [key] which contains a number referring to
the corresponding row number of array 2)
--- cut here: begin --------------------------------------------------
var array2A = new Array (
[ "A", "4" ],
[ "B", "2" ],
[ "C", "1" ],
[ "D", "3" ]
);
--- cut here: end ----------------------------------------------------
2. The second array has minimally 2 columns,
(one extra column [key] which contains a number referring to
the corresponding row number of array 1)
--- cut here: begin --------------------------------------------------
var array2A = new Array (
[ "a", "4" ],
[ "b", "2" ],
[ "c", "1" ],
[ "d", "3" ],
[ "e", "3" ],
[ "f", "3" ]
);
--- cut here: end ----------------------------------------------------
2. To view this arrays, you could use the following code:
--- cut here: begin --------------------------------------------------
<HTML>
<HEADER>
<SCRIPT LANGUAGE = "JavaScript">
<!--
<!-- library: -->
var array1A = new Array (
[ "A", "4" ],
[ "B", "2" ],
[ "C", "1" ],
[ "D", "3" ]
);
// -->
</SCRIPT>
<SCRIPT LANGUAGE = "JavaScript">
<!--
<!-- library: -->
var array2A = new Array (
[ "a", "4" ],
[ "b", "2" ],
[ "c", "1" ],
[ "d", "3" ],
[ "e", "3" ],
[ "f", "3" ]
);
// -->
</SCRIPT>
<SCRIPT LANGUAGE = "JavaScript">
<!--
<!-- library: -->
function PROCDatabaseViewManyToManyArray( array1A, array2A ) {
//
var I = 0;
var minI = 0;
var maxI = array2A.length - 1;
//
var s1 = "";
var s2 = "";
//
var key2I = 0;
//
// use a loop to go through each of the rows in array 2
for ( I = minI; I <= maxI; I++ ) {
s1 = array2A[ I ][ 0 ]; // get the description value of the first
column of array 2 (at that row I)
key2I = array2A[ I ][ 1 ] - 1; // get the key value of the second
column of array 2 (at that row I)
s2 = array1A[ key2I ][ 0 ]; // get the description value of the
first column of array 1 (where row given by the key)
document.write( s1 + " " + s2 );
document.write( "<BR>" );
}
}
// -->
</SCRIPT>
</HEADER>
<BODY
ONLOAD = '
PROCDatabaseViewManyToManyArray( array1A, array2A );
document.write( "<BR>" );
PROCDatabaseViewManyToManyArray( array2A, array1A );
'
>
</BODY>
</HTML>
--- cut here: end ----------------------------------------------------
3. That will show the following output
--- cut here: begin --------------------------------------------------
a D
b B
c A
d C
e C
f C
A d
B b
C a
D c
--- cut here: end ----------------------------------------------------
---
---
The above version is using a 2 dimensional array.
Here a version where the data is further separated
(by putting the description and the keys in a separate 1 column array),
so it will be easier to use (insert, change, replace, ...) your
existing array data (you only have to add an extra column for your
keys to your source code).
--- cut here: begin --------------------------------------------------
<HTML>
<HEADER>
<SCRIPT LANGUAGE = "JavaScript">
<!--
<!-- library: -->
var array11A = new Array (
[ "A" ],
[ "B" ],
[ "C" ],
[ "D" ]
);
// -->
</SCRIPT>
<SCRIPT LANGUAGE = "JavaScript">
<!--
<!-- library: -->
var array12A = new Array (
[ "4" ],
[ "2" ],
[ "1" ],
[ "3" ]
);
// -->
</SCRIPT>
<SCRIPT LANGUAGE = "JavaScript">
<!--
<!-- library: -->
var array21A = new Array (
[ "a" ],
[ "b" ],
[ "c" ],
[ "d" ],
[ "e" ],
[ "f" ]
);
// -->
</SCRIPT>
<SCRIPT LANGUAGE = "JavaScript">
<!--
<!-- library: -->
var array22A = new Array (
[ "4" ],
[ "2" ],
[ "1" ],
[ "3" ],
[ "3" ],
[ "3" ]
);
// -->
</SCRIPT>
<SCRIPT LANGUAGE = "JavaScript">
<!--
<!-- library: -->
function PROCDatabaseViewManyToManyArray( arraydescription1A,
arraykey1A, arraydescription2A, arraykey2A ) {
//
var I = 0;
var minI = 0;
var maxI = arraydescription2A.length - 1;
//
var s1 = "";
var s2 = "";
//
var key2I = 0;
//
// use a loop to go through each of the rows in array 2
for ( I = minI; I <= maxI; I++ ) {
s1 = arraydescription2A[ I ]; // get the description value of the
first column of array 2 (at that row I)
key2I = arraykey2A[ I ] - 1; // get the key value of the second
column of array 2 (at that row I)
s2 = arraydescription1A[ key2I ]; // get the description value of
the first column of array 1 (where row given by the key)
document.write( s1 + " " + s2 );
document.write( "<BR>" );
}
}
// -->
</SCRIPT>
</HEADER>
<BODY
ONLOAD = '
PROCDatabaseViewManyToManyArray( array11A, array12A, array21A,
array22A );
document.write( "<BR>" );
PROCDatabaseViewManyToManyArray( array21A, array22A, array11A,
array12A );
'
>
</BODY>
</HTML>
--- cut here: end ----------------------------------------------------
3. That will show the following output
--- cut here: begin --------------------------------------------------
a D
b B
c A
d C
e C
f C
A d
B b
C a
D c
--- cut here: end ----------------------------------------------------
---
---
You can further separate your data by putting each array in a separate
source file.
first save your data in the following 4 files:
1. Save this in the file data11.txt
--- cut here: begin --------------------------------------------------
var array11A = new Array (
[ "A" ],
[ "B" ],
[ "C" ],
[ "D" ]
);
--- cut here: end ----------------------------------------------------
2. Save this in the file data12.txt
--- cut here: begin --------------------------------------------------
var array12A = new Array (
[ "4" ],
[ "2" ],
[ "1" ],
[ "3" ]
);
--- cut here: end ----------------------------------------------------
3. Save this in the file data21.txt
--- cut here: begin --------------------------------------------------
var array21A = new Array (
[ "a" ],
[ "b" ],
[ "c" ],
[ "d" ],
[ "e" ],
[ "f" ]
);
--- cut here: end ----------------------------------------------------
4. Save this in the file data22.txt
--- cut here: begin --------------------------------------------------
var array22A = new Array (
[ "4" ],
[ "2" ],
[ "1" ],
[ "3" ],
[ "3" ],
[ "3" ]
);
--- cut here: end ----------------------------------------------------
5. Then put this in a .html page and run it in your browser
--- cut here: begin --------------------------------------------------
<HTML>
<HEADER>
<!-- put your data in separate files, so it can easily be changed -->
<SCRIPT
LANGUAGE = "JavaScript"
SRC = "data11.txt"
>
</SCRIPT>
<SCRIPT
LANGUAGE = "JavaScript"
SRC = "data12.txt"
>
</SCRIPT>
<SCRIPT
LANGUAGE = "JavaScript"
SRC = "data21.txt"
>
</SCRIPT>
<SCRIPT
LANGUAGE = "JavaScript"
SRC = "data22.txt"
>
</SCRIPT>
<SCRIPT LANGUAGE = "JavaScript">
<!--
<!-- library: -->
function PROCDatabaseViewManyToManyArray( arraydescription1A,
arraykey1A, arraydescription2A, arraykey2A ) {
//
var I = 0;
var minI = 0;
var maxI = arraydescription2A.length - 1;
//
var s1 = "";
var s2 = "";
//
var key2I = 0;
//
// use a loop to go through each of the rows in array 2
for ( I = minI; I <= maxI; I++ ) {
s1 = arraydescription2A[ I ]; // get the description value of the
first column of array 2 (at that row I)
key2I = arraykey2A[ I ] - 1; // get the key value of the second
column of array 2 (at that row I)
s2 = arraydescription1A[ key2I ]; // get the description value of
the first column of array 1 (where row given by the key)
document.write( s1 + " " + s2 );
document.write( "<BR>" );
}
}
// -->
</SCRIPT>
</HEADER>
<BODY
ONLOAD = '
PROCDatabaseViewManyToManyArray( array11A, array12A, array21A,
array22A );
document.write( "<BR>" );
PROCDatabaseViewManyToManyArray( array21A, array22A, array11A,
array12A );
'
>
</BODY>
</HTML>
--- cut here: end ----------------------------------------------------
6. That will show the following output
--- cut here: begin --------------------------------------------------
a D
b B
c A
d C
e C
f C
A d
B b
C a
D c
--- cut here: end ----------------------------------------------------
---
---
Internet: see also:
---
JavaScript: Database: Overview: Can you give an overview of links?
http://www.faqts.com/knowledge_base/view.phtml/aid/31360/fid/53
----------------------------------------------------------------------
