0

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

1
  • If you add select element for "cities" using Ajax, it is added to the page dynamically. Hence you won't see it in the source code, only in debugger. W3Fools. Commented May 13, 2012 at 13:33

2 Answers 2

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.

Sign up to request clarification or add additional context in comments.

7 Comments

I'm following the tutorial in the url link i have already written in my first post. So, i'm not using jquery but a javascript function that calls a php file, selects from the database the cities and prints the drop down list with the cities to the browser by using "echo"
When you say that i have to "add a node", what does this mean?
That "echo" is the problem. It will update your screen and you'll see the select, but the DOM is not updated, so the select doesn't exist. I'll find an example and post it.
Here is better explained what I mean when I say to add a node: developer.mozilla.org/en/DOM/document.createElement Did you understand the problem?
|
1

Add a client side and server side validator . For example on client side if no cities are selected disable submit button . And on server side if isset($_POST['cities']) is false then don't execute any query simply redirect user to same page with error message "Please select cities"

5 Comments

In my tests the user always chooses one of the cities. My problem is that the ($_POST['cities']) is always blank with no value. What am i supposed to do with that?Thanks
Also, i use echo in order to display to the browser the drop down list for cities.It seems that the <form> does not realise that a new input/drop down list is created and that's why in the submit page, $city is blank.
that tutorial looks old and outdated , try this instead erichynds.com/jquery/jquery-related-dependent-selects-plugin
It's a bit hard for me to understand the tutorial cause i'm using ajax in order to connect to the database and not jquery.
you can use ajax with jquery which is much more simpler .

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.