Populating DropDown - onChange

Posted on 2005-04-11
Last Modified: 2008-03-17

I have this 1st dropdown menu fetching from DB. What I'm looking is how to put the 2nd dropdown code in JavaScript which is also fetchs from DB.
Once I select the value from 1st select box, I need to pass it that value as arguement to get the list of dropdown for 2nd dropdown. how do I pass that in JS. ? next where can I display the 2nd dropdown list in JS or in BODY of HTML.

function myScript() {
 var a = document.sel.product.value;
           (JSP DB connection code)..
            String sp= "{call StoreProcedure_ABC (?)}";

            cs1.setString(1,??????? WHO DO I PASS HERE JAVASCRIPT VAR 'a' VALUE HERE ??????????);

            ResultSet rs = cs1.executeQuery();
                    out.print("<option>"+ rs.getString(1) +"</option>");
<! 1st dropdown -->
out.print("<select size=1 name='product' onChange="script()">");
   out.print("<option>"+ rs.getString(2) +"</option>");

<! 2nd Dropdown -->
Question by:princehyderabad
    LVL 12

    Accepted Solution

    Dear sir,

    There is no way (that I know of) to have your CLIENT SIDE JAVASCRIPT insert a value into your SERVER SIDE JSP.  The client knows nothing about the server.  I know it's horrible but you will have to post your form again.  You could consider filling the first listbox in javascript and then posting after selection takes place.  Another option would be to dump all of your data from your query which is in the stored procedure into a multi dimensional javascript array and then search that array instead of querrying your database.  Performance times would vary though depending on how many records you're talking about.

    This is a very important server programming concept.  The difference between client and server is huge.  you can output plain text from the server because the server is the one that serves up the page to the client.  When the client machine has downloaded the page there is no way for it to send data back to the server without posting a form.

    Good luck, I would try the first idea of filling the first listbox with javascript then posting after filled,  unless your data store is not too massive, then the multi-dimensional array would work!
    LVL 2

    Expert Comment

    In response to this, I'm actually going to bring up a topic, Rich Internet Applications.

    RIAs (Rich Internet Applications) are internet applications that maintain persistant or semi-persistant connections with the web server.  This allows updating of only parts of the page and sending and receiving only the needed pieces of data as opposed to having to submit a form and reload an entire page.

    This model provides a much more efficient use of bandwidth, but more important to this question, this model provides a way of supplying and updating only bits of data on a web page which makes it possible to receive dynamic dropdown lists of information in split seconds from the server and display them on the web page without having to reload the page.

    You are generally able to integrate RIAs with any programming language you like, but often times you will still have to learn at least a little bit about the language that the RIA engine is written in so that you can write any interfaces that you might require.

    There are a couple of different ways to generate RIAs.  The first is to grab an RIA engine that is already developed.  The first that I am going to recommend is an open source project called Laszlo (  The second is a Macromedia product known as Flex (  The issue with these engines however, is that you must re-write your entire user interface using the tools provided by the RIA engines.  The reason for this is that the RIA engines convert your front-end development code into Flash files for display on the web.

    The second way to generate an RIA is to create your own RIA engine that does not require generation of a Flash interface.  I had a plan to create an engine of my own once for the average site, but I got a little too lazy to try to aquire funding.

    Here was my basic idea for creating a simple RIA engine.  Basically, it would be a combination of a Java client that is not visible on the web page and a Java server that would be able to accept and process database and server activities per request of the Java client and send the results back to the Java client when processing completes.  Because JavaScript is able to communicate with Java applets, a JavaScript programmer would easily be able to write or use a pre-written interface library to communicate between the dynamic HTML page objects such as select boxes, text fields, etc and the data to and from the in-page, invisible, Java applet.

    The only problem that I can see in working with all of this is a restriction that is in place for Java applet to server communications.  This restriction states that a user must approve an entity as trusted before that entity may make client/server communications.  This requires that the user click an accept button on a Java dialog before the RIA will function properly.

    <edited by COBOLdinosaur, Page Editor>
    LVL 2

    Expert Comment

    I know it's probably not an inteligent thing to do, but I must disagree with you Mr. Page Editor (actual respect intended).

    The user is looking for a solution that would allow him to dynamically load multiple drop-downs from a database each time another drop-down selection is changed.  He can use basic JavaScript to do this if he were to write a simple Java RIA engine.

    He would be able to use the JavaScript to interface between his drop-downs and the RIA engine thus providing a way to dynamically load and change the data in the drop-downs from a database without having to reload the page.

    I am fairly certain that this solution well targets and addresses the issue at hand.  If I am still mistaken, please don't hesitate to remove my account.

    LVL 17

    Expert Comment

    No comment has been added to this question in more than 21 days, so it is now classified as abandoned..
    I will leave the following recommendation for this question in the Cleanup topic area:

    Accept: jessegivy

    Any objections should be posted here in the next 4 days. After that time, the question will be closed.


    EE Cleanup Volunteer

    Featured Post

    Enabling OSINT in Activity Based Intelligence

    Activity based intelligence (ABI) requires access to all available sources of data. Recorded Future allows analysts to observe structured data on the open, deep, and dark web.

    Join & Write a Comment

    The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
    This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
    The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    734 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

    24 Experts available now in Live!

    Get 1:1 Help Now