Question

I have a form which has a drop down list for countries.

If the user chooses one of the countries (onchange),
a new drop down list for cities appears
displaying only the cities of this specific country.

<select name = \"countries\" id=\"ListOfCountries\" onchange=\"showCities(this.value)\">

I have implemented that by using php, mysql and ajax.

The tutorial i have
studied and followed is in the following link:

http://www.w3schools.com/php/php_ajax_database.asp

The drop down list for cities is displayed automatically on the web page
without loading the page again.

When the cities box appears, if i do
Ctrl-U in order to see the source code of the page,
the html code for the drop down list of cities is not in the source code page.

My problem is that when i submit the form,
the value of the cities’ drop down list
is NOT sent to the submit.php file

index.php

 <form action="submit.php" name="my_form" method="post">

submit.php

 echo $_POST['cities'];

The $_POST[‘cities’]; is blank.

That means that in the submit page NO value
for cities’ drop down list was sent.

What am i supposed to do in order to fix that?

Thanks, in advance

Answer 1

It seems like you are not updating the DOM correcly, so the cities parameter is not avaible when you submit the form.
If you use jQuery, use jQuery.after() or any similar function to update the DOM. If not you’ll have to create a node with the select and add it into the form.