Dropdown list data Binding based on a selection from another list.

Posted on 2005-04-14
Last Modified: 2006-11-18

i have a Webform with two drop down lists. The first list gets it's data from my SQL database, from a table named Schools.

Now,i will use the second list it to populate the departments which belong to the selected school from the 1st List.

How can i make my second list query the database and return all the Departments which belong to the selected School. I want to do this without reloading the page.

Is this possible.

Thank you.
Question by:Globemaster
    LVL 6

    Accepted Solution

    In order to populate the second list box from the database the page has to be reloaded as the client has to make an additional query to the server and then show the resultant page.

    Dynamic boxes of this type can be coded client side using JavaScript but all the departmenst for each school would have to be retrieved and stored in Javascript arrays prior to the page being constructed by the server.  JavaScript can be constructed Dynamicaly just like HTML can.

    So, short answer is no it cannot be done unless you use some client side Javascript.


    LVL 29

    Expert Comment

    Actually, it could be done without reloading the page, but this is a little used method.

    If you make a second ASP page, that only returns the department's list given a URL parameter, (e.g. no HTML tags other than the list box), you can use the XMLHTTP component to retrieve the second list.  I'll call that page getDeptSelect.asp, it would be called, like:  getDeptSelect.asp?school=nameOfSchool

    In your main page the schools list needs an onchange event and associated function....

    <select name="school" onchange="getDepts(this)">

    Your departments select needs to be inside some entity which has a unique ID, say a divide...

    <div id="deptSel">
      <select name="dept"><option>Select School</option></select>

    function getDepts() will be JavaScript...

    <script language="javascript" type="text/javascript">
    function getDepts(oSel) {
        var school = oSel[oSel.selectedIndex].value;
        var oHTTP = new XMLHttpRequest();'GET', 'getDeptSelect.asp?school='+school, false);
        oHTTP = xmlHttp.responseText;

        // oHTTP now has the results from getDeptSelect.asp which should be
        //  <select name="department"><option>....</option></select>

        // put the select into the proper page location
        document.getElementById('deptSel').innerHTML = oHTTP;

    Reference on the XMLHTTP object can be found here: and there are examples on and other ASP locations.


    LVL 6

    Expert Comment

    That is a neat solution but still requires the use of client side code and will still suiffer the delay of  a reload as the script loads the page from the server.

    I like the implementation though.


    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Highfive + Dolby Voice = No More Audio Complaints!

    Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

    I have helped a lot of people on EE with their coding sources and have enjoyed near about every minute of it. Sometimes it can get a little tedious but it is always a challenge and the one thing that I always say is:  The Exchange of information …
    I would like to start this tip/trick by saying Thank You, to all who said that this could not be done, as it forced me to make sure that it could be accomplished. :) To start, I want to make sure everyone understands the importance of utilizing p…
    Migrating to Microsoft Office 365 is becoming increasingly popular for organizations both large and small. If you have made the leap to Microsoft’s cloud platform, you know that you will need to create a corporate email signature for your Office 365…
    In this seventh video of the Xpdf series, we discuss and demonstrate the PDFfonts utility, which lists all the fonts used in a PDF file. It does this via a command line interface, making it suitable for use in programs, scripts, batch files — any pl…

    737 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    20 Experts available now in Live!

    Get 1:1 Help Now