Mega Code Archive

 
Categories / JavaScript DHTML / GUI Components
 

2D Related Comboboxes

<HTML> <HEAD><TITLE>Universal Related Popup Menus / Another Way</TITLE> <BASE HREF="http://www.rntsoft.com"> <STYLE>      .saveHistory {behavior:url(#default#savehistory);} </STYLE> <SCRIPT LANGUAGE="JavaScript"> <!-- v=false; //--> </SCRIPT> <SCRIPT LANGUAGE="JavaScript1.1"> <!-- if (typeof(Option)+"" != "undefined") v=true; //--> </SCRIPT> <SCRIPT LANGUAGE="JavaScript"> <!-- // Universal Related Select Menus - cascading popdown menus // by Andrew King. v1.34 19990720 // Copyright (c) 1999 internet.com LLC. All Rights Reserved. // // This program is free software; you can redistribute it and/or modify // it under the terms of the GNU General Public License as published by // the Free Software Foundation; either version 2 of the License, or // (at your option) any later version. // // This program is distributed in the hope that it will be useful, // but WITHOUT ANY WARRANTY; without even the implied warranty of // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the // GNU General Public License for more details. // // You should have received a copy of the GNU General Public License // along with this program; if not, write to the Free Software // Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA // // Originally published and documented at http://www.webreference.com // Contact aking@internet.com for all other uses. // // Change History // 3-3-96 code optimized, modularized, and made universal-abk // 3-8-97 jumpPage1 and 2 consolidated into generalized func // 3-10-97 changeMenu added jumpPage(0,0), for non-ns3 browsers // make popup act like a live popup when no related functionality // 8-5-97 browser detect script changed to check for option functionality // 9-11-97 aln changed to options.length, as IE 4 does not support // nulling out options // 12-22-98 added SIZE att to make select lists, used named forms/elements // 1-1-99 added getFormNum to fix netscape 2 bug (doesn't support named fms) //  pass formName, elementNum to relate and jmp as workaround //  pass this.form,0 and increment instead of decrement in relate to get  //   next form //  assumes menu2 follows menu1 in HTML // tested in mac ie3.01/ns2.02 (live), ns 3.01,4.05,4.5 and ie4.01 related // 990204 - adopted a more modular/oo approach using two D arrays, thanks //   to Jacob Berner <leo7278@hotmail.com> for his input // 990701 - fixed back button bug in ie4+ by resetting all forms onload-abk //    thanks to peter belesis (pbel@internet.com) for this fix // 990714 - added IE5 persistence - abk pb // 990715 - went open source, created stripped down example files - abk // 990720 - jmp() fix getFormNum(formName);-> //     var formNum = getFormNum(formName); //  if (v) {..} added around newCat array creation for old browsers // 990721 - getFormNum/relate tweaks, unnec code removed,  //     ns2.0 mac fix - getFormNum returns -1 in nested tables //     new jmp bypasses prob - thx to thanks to Michael Guitton //     saramaca@mail.dotcom.fr // 990722 - var for scope added, jmp chgd to named form for ns2.02 bug-abk if(v){a=new Array(22);} function getFormNum (formName) {   var formNum =-1;   for (i=0;i<document.forms.length;i++){     tempForm = document.forms[i];     if (formName == tempForm) {       formNum = i;       break;     }   }   return formNum; } function jmp(form, elt) // The first parameter is a reference to the form. {   if (form != null) {     with (form.elements[elt]) {       if (0 <= selectedIndex)         location = options[selectedIndex].value;     }   } } var catsIndex = -1; var itemsIndex; if (v) { // ns 2 fix function newCat(){   catsIndex++;   a[catsIndex] = new Array();   itemsIndex = 0; } function O(txt,url) {   a[catsIndex][itemsIndex]=new myOptions(txt,url);   itemsIndex++; } function myOptions(text,value){   this.text = text;   this.value = value; } // fill array newCat(); O("3-D Animation","/3d/"); O("Design","/dlab/"); O("DHTML","/dhtml/"); O("E-Commerce","/ecommerce/mm/"); O("Graphics","/graphics/"); O("HTML","/html/"); O("JavaScript","/js/"); newCat(); O("Authoring","/authoring/"); O("E-Commerce","/ecommerce/"); O("Internet","/internet/"); O("Multimedia","/multimedia/"); O("Programming","/programming/"); O("Promotion","/promotion/"); newCat(); O("Domains","/services/dns/"); O("Graphics","/services/graphics/"); O("News Harvester","/headlines/nh/"); O("Reference","/services/reference/"); O("Search","/search.cgi"); O("Validation","/services/validation/"); newCat(); O("Awards","/awards.html"); O("In the News","/inthenews.html"); O("New Features","/features.html"); O("Linking Info","/link.html"); O("Lore","/lore.html"); O("Media Kit","http://www.rntsoft.com/"); O("Press Releases","/press/"); O("Suggest","/cgi-bin/suggest.cgi"); } // if (v) function relate(formName,elementNum,j) { if(v){ var formNum = getFormNum(formName);  if (formNum>=0) {   formNum++; // reference next form, assume it follows in HTML   with (document.forms[formNum].elements[elementNum]) {     for(i=options.length-1;i>0;i--) options[i] = null; // null out in reverse order (bug workarnd)     for(i=0;i<a[j].length;i++){       options[i] = new Option(a[j][i].text,a[j][i].value);      }     options[0].selected = true;   }  } } else { jmp(formName,elementNum); } } // BACK BUTTON FIX for ie4+- or // MEMORY-CACHE-STORING-ONLY-INDEX-AND-NOT-CONTENT // // from peter belesis: // IE4+ remembers the index of each SELECT but NOT the CONTENTS of each // SELECT, so it gets it wrong. // // it has to do with MEMORY CACHE (where form input is stored) and how // IE stores information about SELECT menus. // // IE stores the selectedINDEX ONLY of the SELECT menu, not the // CONTENTS-AT-THE-TIME-OF-SELECTION // // when we return to a page, it displays the default contents of each // SELECT, grabs the stored index from cache and aligns the default // contents to that index. //  // Netscape, on the other hand, seems to remember both INDEX and CONTENTS // added ie5 persistence 990714 function IEsetup(){   if(!document.all) return;   IE5 = navigator.appVersion.indexOf("5.")!=-1;   if(!IE5) {     for (i=0;i<document.forms.length;i++) {       document.forms[i].reset();     }   } } window.onload = IEsetup; //--> </SCRIPT></HEAD> <BODY BGCOLOR="#ffffff"> <CENTER> <TABLE BGCOLOR="#DDCCFF" BORDER="0" CELLPADDING="8" CELLSPACING="0"> <TR VALIGN="TOP"><TD>Choose a subject:<BR><FORM NAME="f1" METHOD="POST" ACTION="/cgi-bin/redirect.cgi" onSubmit="return false;"> <SELECT NAME="m1" ID="m1" CLASS=saveHistory onChange="relate(this.form,0,this.selectedIndex)"><OPTION VALUE="/experts/">Experts<OPTION VALUE="/index2.html">Contents<OPTION VALUE="/services/">Services<OPTION VALUE="/about.html">About</SELECT><INPUT TYPE=SUBMIT VALUE="Go" onClick="jmp(this.form,0);"> </FORM></TD> <TD BGCOLOR="#FFFFFF" VALIGN=MIDDLE><B>---&gt;</B></TD> <TD>Choose a topic:<BR><FORM NAME="f2" METHOD="POST" ACTION="/cgi-bin/redirect.cgi" onSubmit="return false;"> <SELECT NAME="m2" ID="m2" CLASS=saveHistory onChange="jmp(this.form,0)"> <OPTION VALUE="/3d/">3-D Animation <OPTION VALUE="/dlab/">Design <OPTION VALUE="/dhtml/">Dynamic HTML <OPTION VALUE="/ecommerce/mm/">E-Commerce <OPTION VALUE="/graphics/">Graphics <OPTION VALUE="/html/">HTML <OPTION VALUE="/js/">JavaScript</SELECT> <INPUT TYPE=SUBMIT VALUE="Go" onClick="jmp(this.form,0);"> <INPUT TYPE="hidden" NAME="baseurl" VALUE="http://www.rntsoft.com"> </FORM></TD> </TR> </TABLE></CENTER> </BODY> </HTML>