HTML multiple column drop down select box
Posted on 2013-11-02
This is actually related to a PHP page pulling from a MySQL DB, but I'll figure out the rest once I get a working demo.
What I need is to click on an HTML dropdown box that currently displays an index number but when clicked it displays three fields of the data in the drop down. Then when the user makes a choice and it displays only the left, indexed field and onChange it populates a text/input field with the second column of data. Another text field with the 3rd column of data, etc.
Real life scenario: Asset tag, computer and serial number. User is on a web page and they have a choice to select an available computer. They see a drop down that is a list of asset tags. They click the dropdown and it shows "12345 - HP8300 - SN1GGY", "12346 - HP8250 - SN3JB77", "12347 - HP7700 - HK71SB" and so on.
They make a choice of "12345 - HP8300 - SN1GGY" and it returns just "12345" in the visible page/field/box and after they select it, it populates the adjacent fields with "HP8300" and "SN1GGY". This seems so very simple and common.
I'm thinking that maybe as an alternative there is a select/dropdown that always contains all this concatenated data and acts as a "button" or selection tool and this populates my other fields after update. This selection object would not be connected to any data field, it would just populate my other data fields.