Replace all values in a Listbox

Discussion in 'Javascript' started by IanONet@gmail.com, Apr 28, 2006.

  1. Guest

    I have used
    onChange="ReplaceValues(this.options[this.selectedIndex].value)" to
    change several textbox values when a user makes a selection from a
    Select List.

    Now I have the requirement to replace all the values in another Select
    List when a selection is made on the first Select List.

    There are two questions: What is the Javascript syntax for deleting and
    replacing option values in a Select List and how would you (how should
    I ) store the data that I will be using to repopulate an existing
    Select List.

    Thanks,
    IanO
    , Apr 28, 2006
    #1
    1. Advertising

  2. wrote:

    > I have used
    > onChange="ReplaceValues(this.options[this.selectedIndex].value)" to
    > change several textbox values when a user makes a selection from a
    > Select List.


    Only that there is no such built-in method. Which is why this information
    is of little value to other people.

    > Now I have the requirement to replace all the values in another Select
    > List when a selection is made on the first Select List.


    You are about the 4711th person to ask this here. Search the archives.

    > There are two questions: What is the Javascript syntax for deleting and
    > replacing option values in a Select List


    - Deleting an option:

    delete selectRef.options[index];

    If that does not work:

    selectRef.options[index] = null;

    - Shortcut for deleting all options: selectRef.options.length = 0;
    Fall back to a loop of the previous if that does not work.

    - Replace option value:

    selectRef.options[index].value = "...";

    - Add new option:

    selectRef.options[selectRef.options.length] = new Option(...);

    > and how would you (how should I ) store the data that
    > I will be using to repopulate an existing Select List.


    This has been asked before, too. One possibility is:

    var data = {
    sel1Value1: [
    {text: ..., value: ...},
    ...
    ],

    sel1Value2: [
    ...
    ],

    ...
    };

    and then:

    <script type="text/javascript">
    function repopulate(oSrc, sTgt)
    {
    var oTgt = oSrc.form.elements[sTgt];
    if (oTgt)
    {
    // TODO: delete all options of oTgt;
    // maybe it is more efficient to overwrite existing options
    // and delete only those that are no longer needed

    var
    curVal = oSrc.options[oSrc.selectedIndex],
    curData = data[curVal];

    for (var i = 0, len = curData.length; i < len; i++)
    {
    // TODO: add new option using properties of curData
    }
    }
    }

    <select ... onchange="repopulate(this, 'sel2');">

    The data is best generated server-side, by a server-side fallback to handle
    the case that client-side script or DOM support is not available.


    PointedEars
    --
    There are two possibilities: Either we are alone in the
    universe or we are not. Both are equally terrifying.
    -- Arthur C. Clarke
    Thomas 'PointedEars' Lahn, Apr 29, 2006
    #2
    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. blenderdude
    Replies:
    0
    Views:
    969
    blenderdude
    Aug 3, 2003
  2. DC Gringo
    Replies:
    0
    Views:
    397
    DC Gringo
    Apr 6, 2004
  3. kent
    Replies:
    1
    Views:
    873
    Andrew de la Harpe
    May 3, 2004
  4. dcrespo
    Replies:
    10
    Views:
    1,193
    Bruno Desthuilliers
    Oct 30, 2005
  5. Brian McCauley

    Replace substring in all values of a hash array?

    Brian McCauley, May 23, 2005, in forum: Perl Misc
    Replies:
    4
    Views:
    151
    michael
    May 23, 2005
Loading...

Share This Page