Hi Guys,

I've been searching the internet over this one for days now and am even more confused, so I hope you can point me in the right direction. I am basically trying to create a 3 tier cascading dropdown based on country/city/states.

I'm using the following code to create a the second (states) drop down list in a form

<script type="text/javascript">
function sltcountry(parent,child)
    var parent_array = new Array();

        // This is the default value
    parent_array[''] = ['Please select'];

        // All other elements

        // parent_array['PARENT NAME'] = ['CHILD 1','CHILD 2','CHILD 3','ETC'];
        parent_array['1'] = ['1|item 1','2|item 2'];
        parent_array['2'] = ['3|item 3','4|item 4'];

    // Get the child
    var thechild = document.getElementById(child);

    // Remove all other options from the select element
    thechild.options.length = 0;

    // What value are we looking for ?
    var parent_value = parent.options[parent.selectedIndex].value;

    // No value found, use the default value
    if (!parent_array[parent_value]) parent_value = '';

    // Set the correct length
    thechild.options.length = parent_array[parent_value].length;

    // Add the options
    for(var i=0;i<parent_array[parent_value].length;i++)
        var x = parent_array[parent_value][i].split('|');
        thechild.options[i].text = x[1];
        thechild.options[i].value = x[0];

This works fine when i am hand coding the array items, but I am totally lost on how to assign table fields instead. At the moment I am manually looking at my datable tables for country, city and state and matching the IDs to the array items, which is frankly ridiculous and will take forever. So I need to change `

            parent_array['1'] = ['1|item 1','2|item 2'];

to something like..

parent_array['1'] = ['fieldID'],['fieldName'];

of course this doesn't work, and I am guessing its not as simple as that, as i obviously need something like an SQL query for it to work off, but I'm not sure what I need to do to get started.

I should mention that this is on a joomla component that has no support available, so i am a bit stumped. The component does offer an areas to insert javascript, php snippets and on form attributes.

Can anyone point me in the right direction to get this second cascading dropdown to change to the right states when a country is selected.

Thanks very much in advance

4 Years
Discussion Span
Last Post by tsp003

Query your database to collect the data
Use PHP to create a standard list with nested lists of links.
Create a standard menu
Use css to hide the bits you don't want initially shown
Use hover to reveal them.

If you wish to use javascript, use something simple, tried and tested, such as jquery / superfish.


Thanks for the reply.

Using a non-supported joomla component means that it makes life harder. I suppose on reflection my question should have been "Is there anything I can do with the code below to directly query the Db and create the array". I would really like to try to avoid having to create new php and menus. I guess I shall have to look for a way to query the database output the results with the correct formatting and copy and paste it into the javascript, not ideal when new data could be added by users, but i'm really unsure about what else I can do.

Anyone else have any idea?

Thanks again

This article has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.