world countres list with cities - php

Question

is there any solution to show user all countries and after select country it reselect all cities of its country? be best with script selecting
p.s. russian name of countries

Answer 1

Sure, there's a solution. You could have Country and City models with Id and Name properties:
public class Country
{
public int Id { get; set; }
public string Name { get; set; }
}
public class City
{
public int Id { get; set; }
public string Name { get; set; }
}
And an action that would give you all cities in a country:
public class CountriesController : Controller
{
public ActionResult Index()
{
IEnumerable<Country> countries = Repository.GetCountries();
return View(countries);
}
}
public class CitiesController: Controller
{
public ActionResult Index(string countryId)
{
IEnumerable<City> cities = Repository.GetCities(countryId);
return Json(cities);
}
}
And have a view similar to this:
<%= Html.DropDownList("selectedCountry", new SelectList(Model, "Id", "Name")) %>
<%= Html.DropDownList("selectedCity", Enumerable.Empty<City>()) %>
Then setup javascript:
$(function() {
$('#selectedCountry').change(function() {
var selectedCountry = $(this).val();
$.getJSON('/cities/index', { countryId: selectedCountry }, function(cities) {
var citiesSelect = $('#selectedCity');
citiesSelect.empty();
$(json).each(function(i, city) {
citiesSelect.append('<option value="' + city.Id + '">' + city.Name + '</option>');
});
});
});
});

Answer 2

I thing, better solution is use JSON to exists database. For example you can use geonames.org
http://jqueryui.com/demos/autocomplete/#remote-jsonp
Example:
<meta charset="utf-8">
<style>
.ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; }
#city { width: 25em; }
</style>
<script>
$(function() {
function log( message ) {
$( "<div/>" ).text( message ).prependTo( "#log" );
$( "#log" ).attr( "scrollTop", 0 );
}
$( "#city" ).autocomplete({
source: function( request, response ) {
$.ajax({
url: "http://ws.geonames.org/searchJSON",
dataType: "jsonp",
data: {
featureClass: "P",
style: "full",
maxRows: 12,
name_startsWith: request.term
},
success: function( data ) {
response( $.map( data.geonames, function( item ) {
return {
label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
value: item.name
}
}));
}
});
},
minLength: 2,
select: function( event, ui ) {
log( ui.item ?
"Selected: " + ui.item.label :
"Nothing selected, input was " + this.value);
},
open: function() {
$( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
},
close: function() {
$( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
}
});
});
</script>
<div class="demo">
<div class="ui-widget">
<label for="city">Your city: </label>
<input id="city" />
Powered by geonames.org
</div>
<div class="ui-widget" style="margin-top:2em; font-family:Arial">
Result:
<div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
</div>
</div><!-- End demo -->
<div class="demo-description">
<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are cities, displayed when at least two characters are entered into the field.</p>
<p>In this case, the datasource is the geonames.org webservice. While only the city name itself ends up in the input after selecting an element, more info is displayed in the suggestions to help find the right entry. That data is also available in callbacks, as illustrated by the Result area below the input.</p>
</div><!-- End demo-description -->

Answer 3

If you just need a one-time list (and not something that's continuously updated), then manually scraping the Russian Wikipedia page for list of countries isn't too bad. Could do something similar with a list of cities as well, but trying to get a complete list of cities is somewhat foolhardy. I'd try and limit it to the top 200 in the world or so.
Note: I just assume that's the page for list of countries because I speak no Russian but that's the first result I got when I searched for it.