ajax in views block display

In my project I want to implement a interface like www.kijiji.ca for selecting state and city.

For this I am trying to create a view with two seperate blocks one for states and other for cities but I face a problem i.e on selecting a state how to diplay cities without reloading whole page.

You开发者_运维知识库 can understand my problem by visting www.kijiji.ca and plz help me.

You can either load the page with all of the information there and hide it until what is required is clicked, then use javascript to show it. Or you can use ajax to look up the items you need when an item is clicked, again in javascript

I've worked through a situation somewhat like this... My solution was to store the States and Cities in my database. Pull those values when I load the page initially. I create the list of code values for the dropdown list by concatenating the StateCode with "-" and the CityName. The display value is just the CityName. When the window loads, I save the html of the dropdown list using jquery. This allows me to reset the list. Then I initially filter the list by removing the items from the dropdown list that don't match my initially selected StateCode using something like

 $("#AsCity option:not(:contains('[" + checkVal + "]'))").remove();

Then each time the State dropdown list is changed, I reset the CityName dropdown list (using my saved html) and re filter the CityName list by removing the ones that don't match my selected State.