www.webdeveloper.com
Results 1 to 7 of 7

Thread: Javascript question - Copy drop down select lists from one form field to another

  1. #1
    Join Date
    Nov 2012
    Posts
    5

    Javascript question - Copy drop down select lists from one form field to another

    I am new to Javascript and having trouble figuring out how to copy drop down select lists from one form field to another.

    Here is what I have so far:

    function FillShipping(f){ if(f.shippingtoo.checked == true)
    {
    {
    f.email1.value = f.email.value;
    f.fullName1.value = f.fullName.value;
    f.address1.value = f.address.value;
    f.address3.value = f.address2.value;
    f.city1.value = f.city.value;
    f.postCode1.value = f.postCode.value;
    f.phone11.value = f.phone1.value;
    f.phone22.value = f.phone2.value;
    f.phone33.value = f.phone3.value;
    f.cell11.value = f.cell1.value;
    f.cell22.value = f.cell2.value;
    f.cell33.value = f.cell3.value;
    }
    }
    else {
    f.email1.value = '';
    f.fullname1.value = '';
    f.address1.value = '';
    f.address3.value = '';
    f.city1.value = '';
    f.postCode1.value = '';
    f.phone11.value = '';
    f.phone22.value = '';
    f.phone33.value = '';
    f.cell11.value = '';
    f.cell22.value = '';
    f.cell33.value = '';
    }

    } (link to html http://www.echanigraphics.com/test/checkout.html)

    Could someone help please?

    Thanks,

    Elda

  2. #2
    Join Date
    Sep 2011
    Location
    Bristol, England, United Kingdom
    Posts
    192
    I'm not sure exactly what you're asking here, but I think what you're saying is you want a <select> option to be copied to a particular <input> field?

    If so, this sample should help: http://jsfiddle.net/PYnhD/

    Code:
    <select id="options">
        <option value="First" id="First">First</option>
        <option value="Second" id="Second">Second</option>
        <option value="Third" id="Third">Third</option>
    </select>
    
    <input id="copy" />
    <input type="button" id="copy_it" value="Copy it" />
    Code:
    document.getElementById("copy_it").addEventListener
    (
        "click",
        test,
        false
    );
        
    function test()
    {
        var o = document.getElementById("options");
    
        document.getElementById("copy").value = o.options[o.selectedIndex].value;
    }
    ​

  3. #3
    Join Date
    Nov 2012
    Posts
    5
    Thank you that works but what I am looking to do is: when a customer fills out his billing address then checks a box the shipping address populates automatically (with the billing info that the customer has already filled out). And, also, is there any way I can incorporate that to my code above?

    Thank you!

  4. #4
    Join Date
    Sep 2011
    Location
    Bristol, England, United Kingdom
    Posts
    192
    Quote Originally Posted by marelda View Post
    when a customer fills out his billing address then checks a box the shipping address populates automatically (with the billing info that the customer has already filled out).
    You didn't say that in the OP, you talked about copying from drop-down lists. Anyway, I'm not going to incorporate anything into the code you've supplied because I don't know how it's interacting with the rest of your file, but here's an example demonstrating what you've asked for:

    http://jsfiddle.net/a2cfk/

  5. #5
    Join Date
    Mar 2007
    Location
    U.K.
    Posts
    1,127
    Quote Originally Posted by marelda View Post
    Thank you that works but what I am looking to do is: when a customer fills out his billing address then checks a box the shipping address populates automatically (with the billing info that the customer has already filled out). And, also, is there any way I can incorporate that to my code above?
    Do you mean that you want to copy the selection from one <select> to another, which is already populated with identical options?
    Where used, return should be executed unconditionally and always as the last statement in the function.

    That's my signature, it's not part of the damn post!

  6. #6
    Join Date
    Nov 2012
    Posts
    5
    Thank you so much George88, I am sorry I wasn't clear on my first post. One more question, how would I go about the drop down select list? That's the part I am having trouble with. If a customer lets say selects: US (for the state in the billing info) then how do I copy that in the shipping info?

    Thank you!! I really appreciate your help.

  7. #7
    Join Date
    Nov 2012
    Posts
    5
    Figured it out. Thanks again George88.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles