Javascript: Passing data via an option element and "onchange"

Question

I have a "select" element which is being populated by a PHP file. The output is a list of locations with names, addresses, cities, states, etc. I'd like to make it so when this dropdown is changed the new address is loaded into the address form.

Here is the code I'd like to get working, which might explain this better:

<select name='address' id='address'>
    <option value='0' onselect='clearAddress()'></option>
    <option value='1' onselect='loadAddress("1 Main St", "New York")'>Mark's House</option>
    <option value='2' onselect='loadAddress("5 Arc Rd", "Orlando")'>Bob's Apt</option>
    <option value='3' onselect='loadAddress("2 Fox Ln", "Clinton")'>Joe's Bar</option>
</select>

I know onselect doesn't work here, and while adding "onchange" to the select element might work, I can't see how it would function for individual options.

Any thoughts on how to do this? Thanks!

Mithun Satheesh · Accepted Answer · 2013-11-19 16:55:18Z

2

May not be a proper solution but you can do it via

<select name='address' id='address' onchange="doCall(this)">
    <option value='0' data-load=''></option>
    <option value='1' data-load='1 Main St,New York'>Mark's House</option>
    <option value='2' data-load='5 Arc Rd,Orlando'>Bob's Apt</option>
    <option value='3' data-load='2 Fox Ln,Clinton'>Joe's Bar</option>
</select>

and

function doCall(elt) {

   var params = elt.options[elt.selectedIndex].getAttribute("data-load").split(",");

   alert(params[0]);
   alert(params[1]); 

}

here is a fiddle.

answered Nov 19, 2013 at 16:55

Mithun Satheesh

27.9k14 gold badges80 silver badges103 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Bing Over a year ago

Was hoping for something "proper" but I don't think it gets better than this, thanks!

Collectives™ on Stack Overflow

Javascript: Passing data via an option element and "onchange"

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related