Filling an unpack list in PHP dynamically

Question

I have a small PHP page that contains two dropdowns

I need to fill in the second according to the result selected in the first drop-down list .... is this possible? In other words, I need to use the value selected from the first drop-down list and use it in the dB query used to populate the second drop-down list (but this should be filled when selecting the first drop-down list.

If possible, tell me please? (you can assume that I can fill in the first drop-down list from dB)

thanks

Answer 1

Option 1: Insert the data for the second selection in the document as hidden elements or JS objects. The change event handler on the first selection will populate the second selection. A List Apart has an example of a dynamic selection page .

Option 2: Use AJAX. When the first choice changes, make a request to the server for the contents of the second choice, and then fill it. Using a JS library (like jQuery), this becomes quite simple.

 $('select#one').change( function (evt) { $('select#two').load('/thing/'+this.value); } ); 

"/ thing / <Val>" identifies your server side script to create a list of elements based on "<val>"; (use the rewrite tools of your web server to resolve the URL path to the actual script). You could just always generate <option> elements, but the best option would be to include a way to set the format of the result so that it can list as <li> using JSON or some other format.

 $('select#one').change( function (evt) { $('select#two').load('/thing/'+this.value, {fmt: 'option'}); } ); 

Answer 2

You will need to use AJAX to send the selection of the first drop-down list to the server. Then you can query the database and generate a second drop-down menu and send it to the user.

Answer 3

You will need an asynchronous call to the server without reloading the page. (I doubt that you really want to have a button that is sent back to the server). So AJAX is something that can be done that way. Add an AJAX call to your first onchange event onchange , which sends the selection back to the server and returns the contents of the second drop-down list. When an AJAX call returns new values, you will use it to create your content for the second drop-down list. Most of this is done in Javascript, of course, in addition to the actual server side, which will remain in PHP.

Answer 4

There are two ways to do this. The old school “choose an option and submit to restore the page”, which works almost everywhere, and the new AJAX methods to download the second drop-down content without refreshing the page.

Both have advantages / disadvantages, so it comes down to what works best for your purposes. The oldschool method does not require any javascript at all, but since it accesses the form through the server, you will get a “clear the window and then redraw the page” flicker.

The AJAX method bypasses the flickering update, but will also not work in browsers with Javascript disabled. To process AJAX calls and the combination of the drop-down list, a little more code is required, and on the server side the code will be almost the same for both methods: the same requests, the same search loops, only different output methods.

Answer 5

@outis has good use of the .change point in jquery, otherwise use the onchange event in select .

like

 <select id='my_select' onchange='javascript:myfunc()'> <option value='a'>a</option> . . <option value='z'>z</option> function myfunc(){ //write code to populate another dropdown based on selected value } 

You can see this Dynamic popup dropdown based on a different dropdown value