Entry
JavaScript: How to dynamically create a list from an array and its pointers in 2 include src files?
Sep 25th, 2004 09:46
Knud van Eeden,
----------------------------------------------------------------------
--- Knud van Eeden --- 23 September 2004 - 08:32 pm ------------------
JavaScript: How to dynamically create a list from an array and its
pointers in 2 include src files?
---
1. By separating your data and your program in separate files
maintenance
and centralization of your data becomes easier.
2. By using a pointer array (that is, numbers which represent the row
of the other tables) you avoid having to manipulate the main data
itself. So you can leave your main table unchanged and intact, and
use that same main data unchanged in a lot of other applications.
This approach should be one of the simplest to solve that question,
of leaving the original main data the same.
3. Thus you only permutate the numbers (like "1", "2", ...) in array2
to change the order (e.g. to sort) in which the corresponding rows
in array2 are shown. So only that file2 should be changed later.
---
---
Steps: Overview:
1. -Save the main file below as a .html file
(e.g. 'array12.htm')
2. -Save the separate data file with your
array (e.g. as 'yourarray1.js')
in the same directory.
This is your main file.
3. -Save the separate pointer data file with your
array (e.g. as 'yourarray2.js')
in the same directory.
This is your pointer file.
4. -Run the main .html file in your browser
(e.g. 'array12.htm')
---
---
Steps: Worked out:
1. -Save the main file below as a .html file
(e.g. 'array12.htm')
--- cut here: begin --------------------------------------------------
<!-- ------------------------------------------------------>
<HTML>
<!-- ------------------------------------------------------>
<!-- this procedure should be located above (else you will get an
empty list) -->
<SCRIPT>
function PROCTextCreateSelectOptionsPointerNew( formnameS, listnameS,
array1SA, array2SA ) {
var I1 = 0;
var min1I = 0;
var max1I = array1SA.length - 1;
//
var I2 = 0;
//
var s = "";
//
for ( I1 = min1I; I1 <= max1I; I1++ ) {
I2 = array2SA[ I1 ] - 1; // you look in pointer array2 which row
number to choose from array1
s = array1SA[ I2 ]; // and here you get that row number in array1
document.write( eval( 'document.forms.' + formnameS + '.' +
listnameS + '.options.options[' + I1 + '] = new Option( s, s );' ) );
}
//
}
</SCRIPT>
<!-- ------------------------------------------------------>
<SCRIPT
LANGUAGE="JavaScript"
SRC="yourarray1.js"
>
</SCRIPT>
<!-- ------------------------------------------------------>
<SCRIPT
LANGUAGE="JavaScript"
SRC="yourarray2.js"
>
</SCRIPT>
<!-- ------------------------------------------------------>
<BUTTON
ONCLICK = ' document.forms.yourformname.yourlistname.options[
3 ].selected = true;'
>Your button caption</BUTTON>
<!-- ------------------------------------------------------>
<FORM
NAME = "yourformname"
>
<SELECT
NAME = "yourlistname"
>
<SCRIPT>
PROCTextCreateSelectOptionsPointerNew
( "yourformname", "yourlistname",
FNListCreateArrayExample1SA(), FNListCreateArrayExample2SA() );
</SCRIPT>
</SELECT>
</FORM>
<!-- ------------------------------------------------------>
</HTML>
<!-- ------------------------------------------------------>
--- cut here: end ----------------------------------------------------
2. -Save the separate data file with your
array (e.g. as 'yourarray1.js')
in the same directory.
This is your main file.
--- cut here: begin --------------------------------------------------
<!-- library: list: create: array: example -->
function FNListCreateArrayExample1SA() {
//
var arraySA = new Array (
[ "Austria" ],
[ "Belgium" ],
[ "Bulgaria" ],
[ "Czechia" ],
[ "Denmark" ],
[ "Egypt" ],
[ "Finland" ],
[ "France" ],
[ "Germany" ],
[ "Greece" ],
[ "Hungary" ],
[ "India" ],
[ "Ireland" ],
[ "Israel" ],
[ "Italy" ],
[ "Luxemburg" ],
[ "Netherlands" ],
[ "Norway" ],
[ "Poland" ],
[ "Portugal" ],
[ "Russia" ],
[ "South Africa" ],
[ "Spain" ],
[ "Sweden" ],
[ "Switzerland" ],
[ "Turkey" ],
[ "United Kingdom" ],
[ "USA" ]
);
//
return( arraySA );
}
--- cut here: end ----------------------------------------------------
3. -Save the separate pointer data file with your
array (e.g. as 'yourarray2.js')
in the same directory.
This is your pointer file.
--- cut here: begin --------------------------------------------------
<!-- library: list: create: array: example -->
function FNListCreateArrayExample2SA() {
//
var arraySA = new Array (
[ "1" ],
[ "2" ],
[ "3" ],
[ "4" ],
[ "5" ],
[ "6" ],
[ "7" ],
[ "8" ],
[ "9" ],
[ "10" ],
[ "11" ],
[ "12" ],
[ "13" ],
[ "14" ],
[ "15" ],
[ "16" ],
[ "17" ],
[ "18" ],
[ "19" ],
[ "20" ],
[ "21" ],
[ "22" ],
[ "23" ],
[ "24" ],
[ "25" ],
[ "26" ],
[ "27" ],
[ "28" ]
);
//
return( arraySA );
}
--- cut here: end ----------------------------------------------------
4. -Run the main .html file in your browser
(e.g. 'array12.htm')
---
---
Internet: see also:
---
JavaScript: List: Create: Array: Loop: Dynamically: Can you give
overview creating <SELECT><OPTION>?
http://www.faqts.com/knowledge_base/view.phtml/aid/31291/fid/178
----------------------------------------------------------------------
eturn( arraySA );
}
--- cut here: end ----------------------------------------------------
3. -Save the separate pointer data file with your
array (e.g. as 'yourarray2.js')
in the same directory.
This is your pointer file.
--- cut here: begin --------------------------------------------------
<!-- library: list: create: array: example -->
function FNListCreateArrayExample2SA() {
//
var arraySA = new Array (
[ "1" ],
[ "2" ],
[ "3" ],
[ "4" ],
[ "5" ],
[ "6" ],
[ "7" ],
[ "8" ],
[ "9" ],
[ "10" ],
[ "11" ],
[ "12" ],
[ "13" ],
[ "14" ],
[ "15" ],
[ "16" ],
[ "17" ],
[ "18" ],
[ "19" ],
[ "20" ],
[ "21" ],
[ "22" ],
[ "23" ],
[ "24" ],
[ "25" ],
[ "26" ],
[ "27" ],
[ "28" ]
);
//
return( arraySA );
}
--- cut here: end ----------------------------------------------------
4. -Run the main .html file in your browser
(e.g. 'array12.htm')
---
---
Internet: see also:
---
JavaScript: List: Array: Create: How to dynamically create a list from
array? [<SELECT> <OPTION>]
http://www.faqts.com/knowledge_base/view.phtml/aid/31260/fid/53
---
JavaScript: How to dynamically create a list from an array (in 1
include src file)? <SELECT><OPTION>
http://www.faqts.com/knowledge_base/view.phtml/aid/31547/fid/178
----------------------------------------------------------------------
