Populate ListBox

Discussion in 'Javascript' started by James Goodman, Jan 28, 2004.

  1. I have a listbox named sub1 on an asp page. I need to fill this list with
    values from a table. These are selected based upon the selection of a
    value/s in another listbox.
    It was suggested that I use a hidden iframe on my main page, & carry out the
    processing inside the frame, using jscript.

    If I open the page in a browser, & make a selection in the first listbox
    (named main), the data in the frame appears to be processed correctly, the
    following jscript is returned to the browser (in the iframe):

    <script language="JavaScript" type="text/javascript">
    var objElement = window.parent.document.getElementById("sub1");

    objElement[objElement.length] = new Option(Jon, 1);

    objElement[objElement.length] = new Option(James, 2);

    objElement[objElement.length] = new Option(Audit, 13);

    </script>

    To me this looks pretty much correct as no errors are generated (although I
    do not know jscript).

    So my question is, how do I take the next step; how do I get these correctly
    attained values into my listbox?


    --
    Cheers,

    James Goodman MCSE, MCDBA
    http://www.angelfire.com/sports/f1pictures
    James Goodman, Jan 28, 2004
    #1
    1. Advertising

  2. James Goodman

    lallous Guest

    Hello,

    In order to fill a listbox from say ASP or PHP, you can do such (PHP
    example):

    <html>
    <body>
    ...
    ..
    ..
    ..
    <form>
    <select name='listbox1'>
    <?
    $result = mysql_query("SELECT id, name FROM users");
    while ($r = mysql_fetch_array($result))
    {
    if ($somecondition)
    echo sprintf("<option value='%s'>%s</option>\n", $r['id'], $r['name']);
    }
    ?>
    </select>
    </form>
    ..
    ..
    </body></html>

    Your solution is a bit heavy, to emit such code:
    > objElement[objElement.length] = new Option(James, 2);
    >
    > objElement[objElement.length] = new Option(Audit, 13);


    Better that you create a 2D array or two parallel arrays as:
    var x=['James', 'Audit'];
    var y=[2, 13];

    Then using a for loop you can dynamically populate the list box from the JS
    arrays.

    HTH,
    Elias
    "James Goodman" <j a m e .u k> wrote in message
    news:bv8lqg$rbu$...
    > I have a listbox named sub1 on an asp page. I need to fill this list with
    > values from a table. These are selected based upon the selection of a
    > value/s in another listbox.
    > It was suggested that I use a hidden iframe on my main page, & carry out

    the
    > processing inside the frame, using jscript.
    >
    > If I open the page in a browser, & make a selection in the first listbox
    > (named main), the data in the frame appears to be processed correctly, the
    > following jscript is returned to the browser (in the iframe):
    >
    > <script language="JavaScript" type="text/javascript">
    > var objElement = window.parent.document.getElementById("sub1");
    >
    > objElement[objElement.length] = new Option(Jon, 1);
    >
    > objElement[objElement.length] = new Option(James, 2);
    >
    > objElement[objElement.length] = new Option(Audit, 13);
    >
    > </script>
    >
    > To me this looks pretty much correct as no errors are generated (although

    I
    > do not know jscript).
    >
    > So my question is, how do I take the next step; how do I get these

    correctly
    > attained values into my listbox?
    >
    >
    > --
    > Cheers,
    >
    > James Goodman MCSE, MCDBA
    > http://www.angelfire.com/sports/f1pictures
    >
    >
    >
    lallous, Jan 29, 2004
    #2
    1. Advertising

  3. James Goodman

    @SM Guest

    James Goodman a ecrit :
    >
    > I have a listbox named sub1 on an asp page. I need to fill this list with
    > values from a table. These are selected based upon the selection of a
    > value/s in another listbox.
    > It was suggested that I use a hidden iframe on my main page, & carry out the
    > processing inside the frame, using jscript.
    >
    > If I open the page in a browser, & make a selection in the first listbox
    > (named main), the data in the frame appears to be processed correctly, the
    > following jscript is returned to the browser (in the iframe):
    >
    > <script language="JavaScript" type="text/javascript">
    > var objElement = window.parent.document.getElementById("sub1");


    > objElement[objElement.length] = new Option(Jon, 1);
    >
    > objElement[objElement.length] = new Option(James, 2);
    >
    > objElement[objElement.length] = new Option(Audit, 13);
    >
    > </script>
    >
    > To me this looks pretty much correct as no errors are generated (although I
    > do not know jscript).
    >
    > So my question is, how do I take the next step; how do I get these correctly
    > attained values into my listbox?


    ? ?
    I think doing that you added to your listbox "sub1"
    the options :
    <option value="Jon">1
    <option value="James">2
    <option value="Audit">3

    ==== To run it ========

    <html>
    <script type="text/javascript">
    function add(list,val,txt) {
    if(document.getElementById) {
    var objElement = window.parent.document.getElementById(list);
    objElement[objElement.length] = new Option(txt,val); }
    else { // if DOM is not understood by the browser
    var objElement = parent.document.forms[0].elements
    • .options;
      // new index for options = length of array of options
      // and immediatly increase this length ( = create a new option)
      objElementNewIndex = objElement.length++;
      with(objElement[objElementNewIndex]) { value=val; text=txt; }
      }
      }
      sp='http://perso.wanadoo.fr/stephane.moriaux/merci.htm';
      </script>
      <form><select id="sub1" name="sub1" onchange="o=this.options[this.options.selectedIndex];
      if(o.text=='Stephane') {location.href=o.value;}
      else alert(o.value);">
      <option>See here added options
      </select></form>
      <p><a href="#" onclick="add('sub1','Jon',1);">Add Jon</a>
      <p><a href="#" onclick="add('sub1',sp,'Stephane');">Add @SM</a>
      <p><a href="#" onclick="add('sub1','Jack',3);">Add Jack</a>
      </html>

      ====== Other example ==================>
      (to get a list feed by an other list )

      <html>
      <script type="text/javascript">
      function ajouter(){ // JS of our grd' fathers running every where
      var o = document.forms['formOne'].elements['liste'].options;
      var o = o[o.selectedIndex];
      var w = document.forms['formTwo'].elements['liste'].options;
      var l = w.length++;
      with(w[l]) { text=o.text; value=o.value; }
      }

      // only to see something
      function valid(){ // copy of last choice in text fields
      var d = document.forms['formulaire'];
      var o = d.elements['liste'].options;
      o = o[o.selectedIndex];
      d.elements['saisie'].value=o.text;
      d.elements['aller'].value=o.value;
      }
      </script>
      <form name=formTwo>
      <p><select name=liste >
      <option value=0>See new list
      </select>
      </form>
      <form name=formOne>
      <p><select name=liste >
      <option value=0>Choice a file
      <option value="009.htm">009
      <option value="010.htm">010
      <option value="011.htm">011
      <option value="012.htm">012
      </select>
      <p>then click one of these buttons :
      <br><input type=button value="Test with info"
      onclick="valid();ajouter();">
      <input type=button value="Direct Test"
      onclick="ajouter();">
      <p>The New Option :
      <br>Its text : <input type=text name=saisie>
      <br>Its value : <input type=text name=aller>
      </form></html>

      --
      ******** (enlever/remove [OTER_MOI] du/from reply url) *******
      St├ęphane MORIAUX : mailto:
      Aide aux Pages Perso (images & couleurs, formulaire, CHP, JS)
      http://perso.wanadoo.fr/stephane.moriaux/internet/
      **************************************************************
    @SM, Jan 29, 2004
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Mike
    Replies:
    1
    Views:
    469
    Ken Cox [Microsoft MVP]
    Jun 29, 2004
  2. RA
    Replies:
    4
    Views:
    33,108
    Srijith
    Aug 5, 2007
  3. Devin Wood

    Populate a Listbox by using JavaScript

    Devin Wood, Mar 22, 2005, in forum: ASP .Net
    Replies:
    1
    Views:
    2,421
    Eliyahu Goldin
    Mar 22, 2005
  4. Chris Kettenbach

    Listbox selection to populate another listbox?

    Chris Kettenbach, Jun 15, 2005, in forum: ASP .Net
    Replies:
    3
    Views:
    1,637
    Chris Kettenbach
    Jun 16, 2005
  5. Enjoy Life
    Replies:
    2
    Views:
    262
    Roland Hall
    Feb 23, 2005
Loading...

Share This Page