SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Member
    Join Date
    Feb 2006
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Chained Combo Boxes - Country / State / Area

    Hi!

    I'm trying to achieve a chained combo which enables the user to select the Country and dependant on the selection, it then activates and populates the State combo box with the relevant data and then upon selecting this, it then activates and populates the Area combo box.

    All of this will be from a MySQL database and rather than using a standard GET PHP command and reloading the page each time, can Ajax (which I'm completely new to) achieve this on the fly?

    Any help or links to examples would be fantastic.

    Thanks in advance.

  2. #2
    SitePoint Wizard silver trophybronze trophy Cups's Avatar
    Join Date
    Oct 2006
    Location
    France, deep rural.
    Posts
    6,869
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    Depending on the amount of options you have, this can be done purely client side, simply send all the options as JS arrays to the client.

    Take a look at how the airline home pages handle it. www.easyjet.com www.ryanair.com - pick an airport and the destinations pre-populate client side.

    I don't know if you might find this route easier ( no pun intended ).

  3. #3
    SitePoint Member
    Join Date
    Feb 2006
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Cups View Post
    Depending on the amount of options you have, this can be done purely client side, simply send all the options as JS arrays to the client.

    Take a look at how the airline home pages handle it. www.easyjet.com www.ryanair.com - pick an airport and the destinations pre-populate client side.

    I don't know if you might find this route easier ( no pun intended ).
    Yes, that "route" ( ) would definately suit me!

    Is that possible using PHP to call the data from the MySQL db? Do you have any examples I could use?

    Thanks.

  4. #4
    hi galen's Avatar
    Join Date
    Jan 2006
    Location
    New Haven, CT
    Posts
    1,228
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can't do it in php without refreshing the page. you have to use javascript.

  5. #5
    SitePoint Member
    Join Date
    Feb 2006
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by galen View Post
    You can't do it in php without refreshing the page. you have to use javascript.
    Assuming it would be combined?

    PHP to call the data and java to change it?

  6. #6
    hi galen's Avatar
    Join Date
    Jan 2006
    Location
    New Haven, CT
    Posts
    1,228
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yes that's AJAX and it can be done that way.

  7. #7
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,863
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    You would definitely need to use Ajax for this (along with page refreshes for thosw without JavaScript/Ajax). To start with there are about 250 countries and many of those have a half dozen or more states so the complete list of states is probably over a thousand. Once you get to areas within states you are probably talking 5000-10000 entries. You could barely fit a list of all the states in the world into a web page (assuming that the page contained nothing but that list) and so incluuding the entire list into a JavaScript array in the page is completely unworkable.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  8. #8
    SitePoint Member
    Join Date
    Feb 2006
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm confused...

    Is anyone aware if there are any coding examples to where I can begin?

  9. #9
    SitePoint Wizard wonshikee's Avatar
    Join Date
    Jan 2007
    Posts
    1,223
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    This test will get you where you need to go.

    Have 2 files at root. ajax.php and test.php

    Put this in test.php

    HTML Code:
    <script>
    function ajaxTest(x) {
    		var ajaxReq; 
    		try {
    			// Opera 8.0+, Firefox, Safari
    		ajaxReq = new XMLHttpRequest();
    		} catch (e){
    			// Internet Explorer Browsers
    			try {
    				ajaxReq = new ActiveXObject("Msxml2.XMLHTTP");
    			} catch (e) {
    				try {
    					ajaxReq = new ActiveXObject("Microsoft.XMLHTTP");
    				} catch (e) {
    					// Something went wrong
    					alert("Your browser broke!");
    					return false;
    				}
    			}
    		}
    		ajaxReq.open("GET", 'ajax.php?num=' + x, true);
    		ajaxReq.onreadystatechange = function() {
    			if(ajaxReq.readyState == 4){
    				alert(ajaxReq.responseText);
    			}
    		}
    		ajaxReq.send(null); 
    }
    </script>
    <input type='button' value='One' onclick='ajaxTest(1)' />
    
    <input type='button' value='Two' onclick='ajaxTest(2)' />
    In ajax.php Put this:

    PHP Code:
        echo  $_GET['num'] * $_GET['num']; 

  10. #10
    SitePoint Wizard silver trophybronze trophy Cups's Avatar
    Join Date
    Oct 2006
    Location
    France, deep rural.
    Posts
    6,869
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    Despite previous posters comments, its like I already said, your choices ride on how many options you have, any more than, say, 1000 then I'd say either send the page back, or use Ajax.

    Dont take this the wrong way, but if cannot work out how to make 1000 Javascript arrays in a PHP script then I'd really question your ability to use Ajax efficiently.

    So fall back to sending the page back to the server and keep life simple

  11. #11
    SitePoint Addict
    Join Date
    Mar 2005
    Posts
    314
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs up

    Hi Folks,

    I have already developed such a solution that stores ~250 countries in a country table and roughly 5,000 state/provinces in a states table and generates appropriate javascript cache files (countries.js) via PHP which is then read by the html page and automatically populates the State/Province based on the Country selected via pulldown interface.

    While it's not AJAX, it is pure javascript and does the job well. It instantly populates the states once a new country is selected (no browser refresh required) which is really nice.

    a $_POST would generate for example:

    $_POST['country'] = 'Canada'
    $_POST['province'] = 'Ontario'

    If you are interested in this script it's available for $20. The only reason I'm selling is because I manually entered every state in the database (over 5,000) of them and it took me (on and off) about 3 days.

    This does Country and States. It does not chain States to Cities. However that could be in the next version. Pretty easy to find cities based on states/provinces these days

  12. #12
    SitePoint Member
    Join Date
    Feb 2006
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by psalzmann View Post
    Hi Folks,

    I have already developed such a solution that stores ~250 countries in a country table and roughly 5,000 state/provinces in a states table and generates appropriate javascript cache files (countries.js) via PHP which is then read by the html page and automatically populates the State/Province based on the Country selected via pulldown interface.

    While it's not AJAX, it is pure javascript and does the job well. It instantly populates the states once a new country is selected (no browser refresh required) which is really nice.

    a $_POST would generate for example:

    $_POST['country'] = 'Canada'
    $_POST['province'] = 'Ontario'

    If you are interested in this script it's available for $20. The only reason I'm selling is because I manually entered every state in the database (over 5,000) of them and it took me (on and off) about 3 days.

    This does Country and States. It does not chain States to Cities. However that could be in the next version. Pretty easy to find cities based on states/provinces these days
    That sounds like it could be the solution for me.

    I would certainly be willing to pay you for it. However, I will only be using a handful of countries, so this should speed it up.

    I look forward to your response.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •