Web Analytics Made Easy -
StatCounter 3 Connected Select Boxes - CodingForum

Announcement

Collapse
No announcement yet.

3 Connected Select Boxes

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • 3 Connected Select Boxes

    I am having trouble with a javascript. I found some code on the net that displays three <select> menus - selecting the first one determines what appears in the second one and when you select an option from the second one, the third one is populated.

    Check it out here:
    http://www.waterproofing.co.nz/2/applications/

    On the script's original page it works fine, I coppied all the code exactly and pasted it in my page and I got the same error that I get on the above page.

    The menus react correctly but I get an error: 'idOk' is undefined.

    The form is below:

    PHP Code:
    <form method="POST" name="cascade">
            <
    table  border="0" cellspacing="4" cellpadding="0">
              <
    tr>
                <
    td align="right"><strong>Application</strong></td>
                <
    td><img src="../images/arrow_grey.gif" width="12" height="12" hspace="3" vspace="3"></td>
                <
    td><select name="City" size="1" onchange="fillSel(this)">
                  <
    option selected>-- Select a City --</option>
                  <
    option value="selList1">New York</option>
                  <
    option value="selList2">Paris</option>
                </
    select></td>
              </
    tr>
              <
    tr>
                <
    td align="right"><strong>Product</strong></td>
                <
    td><img src="../images/arrow_grey.gif" width="12" height="12" hspace="3" vspace="3"></td>
                <
    td><select name="Area" size="1" onchange="fillSel(this)">
                  <
    option selected>-- Select an Area --</option>
                </
    select></td>
              </
    tr>
              <
    tr>
                <
    td align="right"><strong>Page</strong></td>
                <
    td><img src="../images/arrow_grey.gif" width="12" height="12" hspace="3" vspace="3"></td>
                <
    td><select name="Address" size="1">
                  <
    option selected>-- Select a Neighborhood --</option>
                </
    select></td>
              </
    tr>
            </
    table>
    </
    form
    The script is below:

    PHP Code:
    <script language="javascript">
    <!-- 
    selList1 = new Array("New York""""Brooklyn","selList3""Manhattan""selList4");
    selList2 = new Array("Paris""""2nd Arrondismont","selList5""3rd Arrondisemont""selList6");
    selList3 = new Array("Brooklyn""""Park Slope""""Bay Ridge""""Coney Island""""Sunset Park""""SheepsHead Bay""");
    selList4 = new Array("Manhattan""""Greenwich Village""""East Village""""SoHo""""Little Italy""");
    selList5 = new Array("2nd Arrondismont","","Rive Gauche""""St. Germaine""""Luxembourg Jardins""");
    selList6 = new Array("3rd Arrondismont","","le Cite""""Champs d'Elysee""");

    function 
    fillSel(selObj)
    {
      var 
    destList = (selObj.name == "City") ? "Area" "Address"
      var 
    0;
      var 
    newItem;
      var 
    src;
      var 
    srcName "";

       for (
    0selObj.lengthi++)
          if (
    selObj.options[i].selected)
             
    srcName selObj.options[i].value;

       
    src = eval(srcName);

      var 
    dest = eval("document.cascade." destList);    

      
    with (dest)   
      {
         
    options.length 0;
         for (
    0src.lengthi++)
         {
           
    newItem options.length;
           
    options[newItem] = new Option(src[i]);
           
    options[newItem].value src[i+1];
           
    i++;
         }
         
    options[0].selected true;
      }
      if (!
    isOkhistory.go(0);
    }

    //-->
    </script
    I am no javascript whizz, any help to try and eliminate this error is apprciated
    eTheory - the theory of revolution

  • #2
    I believe this is the line that is causing the problem:
    if (!isOk) history.go(0);


    The variable isOk is not being set anywhere. I suspect that check was put there for NS4 version browsers as they needed to be reloaded for the changes to the selects to take place. Some where in the script that you copied there should have been a browser check for NS4 version browsers that would set that variable. If you are not woried about NS4 version browsers then you could take the line out. If that is not the case then you could change the line to:
    if(document.layers)
    {history.go(0)}

    Comment


    • #3
      You mean "isOK"...

      isOK is not OK. It is not defined as per the error msg. "isOK" is used in an IF statment but it was not defined before use; more to the point, it was not set to a value anywhere before it was used in the IF statement.

      I imagine this variable is a flag to indicate that this went ok above the IF (or not) and to goto "history.go(0)" - the first page in the history list of the browser - if it is not OK.

      Comment

      Working...
      X