Skip to content Skip to sidebar Skip to footer

Dynamically Populate Drop Down Menu With Selection From Previous Drop Down Menu

I have a cgi script written in Python. There are two drop down menus and then a submit button. I'd like to be able to make a selection from the first menu, and based off that choic

Solution 1:

This is an hint: you can populate the next menu with an ajax call to a server side page (that will give you back the data): this will let you: - Avoid to send forms and pass values through pages (you will send the form only at the end) - Let user changes his choise (if he need it), without surfing the history

I think that using ajax with jquery will be really simple to use, also if you don't know it.

Please, check short ajax jquery fiddle example to see how easy is to use jquery (here, for cross domain request, that shouln't be your case, you have to disable web security of your browser, e.g. for google chorme set google chrome to make cross domain request with ajax )

code of the fiddle:

<scriptsrc="http://code.jquery.com/jquery-1.9.1.js"></script><body><selectname="a"id="a"onchange="func(this.value)"><optionvalue="">choose</option><optionvalue="https://www.google.it/search?q=ajax+and+juery&oq=ajax+and+juery&aqs=chrome.0.57j0l3.7474j0&sourceid=chrome&ie=UTF-8#sclient=psy-ab&q=ajax+jquery&oq=ajax+jquery&gs_l=serp.3..0l10.2179.3578.2.3820.7.3.1.3.3.1.206.516.0j2j1.3.0...0.0.0..1c.1.15.serp.9gdUZUmAxcI&psj=1&bav=on.2,or.r_qf.&bvm=bv.47244034,d.ZGU&fp=41333c9f97f3f20a&biw=800&bih=505">google</option><optionvalue="http://it.bing.com/search?q=ajax+jquery&go=&qs=n&form=QBLH&filt=all&pq=ajax+jquery&sc=0-0&sp=-1&sk=">bing</option></select></body><script>functionfunc(ak){
$.ajax({
    url : ak,
    success : function (data,state) {
        $("body").html(data);
        alert(state);
    },
    error : function (request,state,error) {
        alert("Error. stato della chiamata: "+request+'  '+error+'   '+state);
    console.log("Error. stato della chiamata: "+request+'  '+error+'   '+state);
    }
});
}
</script>

Post a Comment for "Dynamically Populate Drop Down Menu With Selection From Previous Drop Down Menu"