Different user input boxes are automatically populated based on a value of the dropdown box.

Discussion in 'Javascript' started by reneeccwest, Jul 3, 2003.

  1. reneeccwest

    reneeccwest Guest

    Different user input boxes are automatically populated based on a
    value of the dropdown box.

    Can anyone help me on that?
     
    reneeccwest, Jul 3, 2003
    #1
    1. Advertising

  2. reneeccwest

    Grant Wagner Guest

    Re: Different user input boxes are automatically populated based on avalue of the dropdown box.

    reneeccwest wrote:

    > Different user input boxes are automatically populated based on a
    > value of the dropdown box.
    >
    > Can anyone help me on that?


    <form name="myForm">
    <input type="text" name="inputOne">
    <input type="text" name="anotherInput">
    <select name="mySelect" onchange="setInputs(this);">
    <option value="None">Choose</option>
    <option value="1">One</option>
    <option value="2">Two</option>
    </select>
    </form>
    <script type="text/javascript">
    var inputValues =
    [
    {
    inputOne:'',
    anotherInput:''
    },
    {
    inputOne:'value for One',
    anotherInput:'another value for One'
    },
    {
    inputOne:'Two was picked',
    anotherInput:'Tooooo'
    }
    ];

    function setInputs(selObj) {
    var f = selObj.form;

    var selectedItem = selObj.selectedIndex;

    var inputs = inputValues[selectedItem];

    for (var input in inputs) {
    f.elements[input].value = inputs[input];
    }
    }
    </script>

    --
    | Grant Wagner <>

    * Client-side Javascript and Netscape 4 DOM Reference available at:
    *
    http://devedge.netscape.com/library/manuals/2000/javascript/1.3/reference/frames.html

    * Internet Explorer DOM Reference available at:
    *
    http://msdn.microsoft.com/workshop/author/dhtml/reference/dhtml_reference_entry.asp

    * Netscape 6/7 DOM Reference available at:
    * http://www.mozilla.org/docs/dom/domref/
    * Tips for upgrading JavaScript for Netscape 6/7 and Mozilla
    * http://www.mozilla.org/docs/web-developer/upgrade_2.html
     
    Grant Wagner, Jul 10, 2003
    #2
    1. Advertising

  3. reneeccwest

    reneeccwest Guest

    Re: Different user input boxes are automatically populated based on a value of the dropdown box.

    thank you for your help!
    but i meant...
    Depends on the value of the combo box, text input boxes will be dynamic.
    for example,
    there are 5 text input boxes (let's name them as "inputOne", "inputTwo",
    "inputThree", "inputFour", and "inputFive") and if the value of combox is
    selected as "One",
    then the first text input box ("inputOne") and the third input box
    ("inputThird")will be appeared, but rest of them will be disappeared.

    if the value of combox is selected as "two",
    then the second text input box ("inputsecond"), the fourth text input box
    ("inputFourth") and the five input box ("inputThird")will be appeared, but
    rest of them will be disappeared.


    "Grant Wagner" <> wrote in message
    news:...
    > reneeccwest wrote:
    >
    > > Different user input boxes are automatically populated based on a
    > > value of the dropdown box.
    > >
    > > Can anyone help me on that?

    >
    > <form name="myForm">
    > <input type="text" name="inputOne">
    > <input type="text" name="anotherInput">
    > <select name="mySelect" onchange="setInputs(this);">
    > <option value="None">Choose</option>
    > <option value="1">One</option>
    > <option value="2">Two</option>
    > </select>
    > </form>
    > <script type="text/javascript">
    > var inputValues =
    > [
    > {
    > inputOne:'',
    > anotherInput:''
    > },
    > {
    > inputOne:'value for One',
    > anotherInput:'another value for One'
    > },
    > {
    > inputOne:'Two was picked',
    > anotherInput:'Tooooo'
    > }
    > ];
    >
    > function setInputs(selObj) {
    > var f = selObj.form;
    >
    > var selectedItem = selObj.selectedIndex;
    >
    > var inputs = inputValues[selectedItem];
    >
    > for (var input in inputs) {
    > f.elements[input].value = inputs[input];
    > }
    > }
    > </script>
    >
    > --
    > | Grant Wagner <>
    >
    > * Client-side Javascript and Netscape 4 DOM Reference available at:
    > *
    >

    http://devedge.netscape.com/library/manuals/2000/javascript/1.3/reference/frames.html
    >
    > * Internet Explorer DOM Reference available at:
    > *
    >

    http://msdn.microsoft.com/workshop/author/dhtml/reference/dhtml_reference_entry.asp
    >
    > * Netscape 6/7 DOM Reference available at:
    > * http://www.mozilla.org/docs/dom/domref/
    > * Tips for upgrading JavaScript for Netscape 6/7 and Mozilla
    > * http://www.mozilla.org/docs/web-developer/upgrade_2.html
    >
    >
     
    reneeccwest, Jul 12, 2003
    #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 P
    Replies:
    1
    Views:
    386
    DavidG
    Jan 13, 2006
  2. vishnu
    Replies:
    1
    Views:
    1,252
    Patrick.O.Ige
    Mar 25, 2006
  3. Stefan Mueller
    Replies:
    5
    Views:
    12,534
    jamesxa
    Jun 16, 2009
  4. Susan Cranford
    Replies:
    2
    Views:
    432
  5. jnag
    Replies:
    2
    Views:
    317
    Nick Fletcher
    Feb 27, 2008
Loading...

Share This Page