Menus & Navigation
|
|
|
|
<? // make conection and retrieve data from oracle db or any external db to collect info for the tree-like data
$conn = ocilogon("db_user","pass","oracle_sid"); $sql = "select NAME, ID, OWNER_ID from TABLE_NAME"; $stmt = ociparse($conn,$sql); ociexecute($stmt); $x=0;
while (OCIFetchInto($stmt,$data,OCI_ASSOC)) { $parse_data[$x][1] = $data["ID"]; $parse_data[$x][2] = $data["OWNER_ID"]; $parse_data[$x][3] = $data["NAME"]; $x++; } ?>
<html>
<head>
<title>Untiltled</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<script language="JavaScript">
<!--hide this script from non-javascript-enabled browsers
// Combining retrived data into variable $report (placing separator "|" between each element)
<? for ($i=0; $i<count($parse_data); $i++) { $report.=$parse_data[$i][1]."|".$parse_data[$i][2]."|".$parse_data[$i][3]."|"; } ?>
var boxes_id=new Array(); var boxes_owner=new Array(); var boxes_name=new Array();
// PRINTING THE $report var INTO THE HTML/JAVASCRIPT VAR
var data = "<? print $report?>";
var cnt = "<? print count($parse_data) ?>";
//SPLIT DATA INTO ARRAY
var datasplit=data.split("|");
//REDISTRIBUTING AGAIN THE COLLECTED DATA FROM THE DB, INTO 3 DIFFERENT ARRAY CORRESPONDING TO THE FIELDS
for (var q=0; q<(cnt*3); q+=3) {
boxes_id[q] = datasplit[q]; boxes_owner[q] = datasplit[q+1]; boxes_name[q] = datasplit[q+2];
}
/* The following functions are self-related - each one calls the next one, to implement the dynamic dropdown updates.
*/
// This is the function called on page OnLoad - responsible for the first dropdown (frm.combo1)
function Go1() {
var r=0; var plc=0; var b1=0;
for (r=0; r<=(cnt*3); r++) {
if (boxes_owner[r] == 1) { newOptionName = new Option(boxes_name[r], boxes_name[r]);
self.frm.combo1.options[b1] = newOptionName; b1++; }}
Go2();
}
// Called from Go1 - responsible for the second dropdown (frm.combo2)
function Go2() {
var r=0; var plc=0; var b2=0; var sel = 0;
for (i=(self.frm.combo2.options.length); i>0; i--) {frm.combo2.options[i]=null;}
var str2 = self.frm.combo1.options[self.frm.combo1.selectedIndex].text;
for (r=0; r<=(cnt*3);r++) { if (boxes_name[r] == str2) { sel = boxes_id[r]; }}
for (r=0; r<=(cnt*3); r++) {
if (boxes_owner[r] == sel) { newOptionName = new Option(boxes_name[r],boxes_name[r]);
self.frm.combo2.options[b2] = newOptionName; b2++; }}
self.frm.combo2.options[0].selected = true;
Go3();
}
// Called from Go2 - responsible for the third dropdown (frm.combo3)
function Go3() {
var r=0; var plc=0; var b3=1; var sel = 0;
for (i=(self.frm.combo3.options.length); i>0; i--) {frm.combo3.options[i]=null;}
var str3 = self.frm.combo2.options[frm.combo2.selectedIndex].text;
for (r=0; r<=(cnt*3); r++) { if (boxes_name[r] == str3) { sel = boxes_id[r]; }}
newOptionName = new Option(" . . .",""); self.frm.combo3.options[0] = newOptionName;
for (r=0; r<=(cnt*3); r++) {
if (boxes_owner[r] == sel) { newOptionName = new Option(boxes_name[r],boxes_name[r]);
self.frm.combo3.options[b3] = newOptionName; b3++; }}
self.frm.combo3.options[0].selected = true;
}
//GetFunnky calls the new URL and may parse further parameters to it
function GetFunky() {
window.location.href="http://new.url.com/external_file.php?id=";
}
//-->
</script>
</HEAD>
... see example for form details.
|
|
|
Usage Example
|
<?
$conn = ocilogon("db_user","pass","oracle_sid"); $sql = "select NAME, ID, OWNER_ID from TABLE_NAME"; $stmt = ociparse($conn,$sql); ociexecute($stmt); $x=0;
while (OCIFetchInto($stmt,$data,OCI_ASSOC)) { $parse_data[$x][1] = $data["ID"]; $parse_data[$x][2] = $data["OWNER_ID"]; $parse_data[$x][3] = $data["NAME"]; $x++; } ?>
<html>
<head>
<title>Untiltled</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<script language="JavaScript">
<!--hide this script from non-javascript-enabled browsers
<? for ($i=0; $i<count($parse_data); $i++) { $report.=$parse_data[$i][1]."|".$parse_data[$i][2]."|".$parse_data[$i][3]."|"; } ?>
var boxes_id=new Array(); var boxes_owner=new Array(); var boxes_name=new Array();
var data = "<? print $report?>";
var cnt = "<? print count($parse_data) ?>";
var datasplit=data.split("|");
for (var q=0; q<(cnt*3); q+=3) {
boxes_id[q] = datasplit[q]; boxes_owner[q] = datasplit[q+1]; boxes_name[q] = datasplit[q+2];
}
function Go1() {
var r=0; var plc=0; var b1=0;
for (r=0; r<=(cnt*3); r++) {
if (boxes_owner[r] == 1) { newOptionName = new Option(boxes_name[r], boxes_name[r]);
self.frm.combo1.options[b1] = newOptionName; b1++; }}
Go2();
}
function Go2() {
var r=0; var plc=0; var b2=0; var sel = 0;
for (i=(self.frm.combo2.options.length); i>0; i--) {frm.combo2.options[i]=null;}
var str2 = self.frm.combo1.options[self.frm.combo1.selectedIndex].text;
for (r=0; r<=(cnt*3);r++) { if (boxes_name[r] == str2) { sel = boxes_id[r]; }}
for (r=0; r<=(cnt*3); r++) {
if (boxes_owner[r] == sel) { newOptionName = new Option(boxes_name[r],boxes_name[r]);
self.frm.combo2.options[b2] = newOptionName; b2++; }}
self.frm.combo2.options[0].selected = true;
Go3();
}
function Go3() {
var r=0; var plc=0; var b3=1; var sel = 0;
for (i=(self.frm.combo3.options.length); i>0; i--) {frm.combo3.options[i]=null;}
var str3 = self.frm.combo2.options[frm.combo2.selectedIndex].text;
for (r=0; r<=(cnt*3); r++) { if (boxes_name[r] == str3) { sel = boxes_id[r]; }}
newOptionName = new Option(" . . .",""); self.frm.combo3.options[0] = newOptionName;
for (r=0; r<=(cnt*3); r++) {
if (boxes_owner[r] == sel) { newOptionName = new Option(boxes_name[r],boxes_name[r]);
self.frm.combo3.options[b3] = newOptionName; b3++; }}
self.frm.combo3.options[0].selected = true;
}
function GetFunky() {
window.location.href="http://new.url.com/external_file.php?id=";
}
//-->
</script>
</HEAD>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="Go1()";>
<form name="frm" method="post" action="">
<table width="400" border="0" cellspacing="0" cellpadding="5" align="center">
<tr bgcolor="#CCCCCC">
<td> >
<select name="combo1" onChange="Go2()" >
<option selected>?</option>
</select>
</td>
</tr>
<tr bgcolor="#CCCCCC">
<td> >
<select name="combo2" onChange="Go3()">
<option selected>?</option>
</select>
</td>
</tr>
<tr bgcolor="#CCCCCC">
<td>>
<select name="combo3">
<option selected>?</option>
</select>
</td>
</tr>
<tr bgcolor="#CCCCCC">
<td><a href="javascript:GetFunky()"><b>List products...</b></a> </td>
</tr>
</table>
</form>
</body>
</html>
|
|
|
Rate This Script
|
|
|
|