AJAX Combo box


DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 3 of 3

Thread: AJAX Combo box

Hybrid View

  1. #1
    Join Date
    Dec 2006
    Posts
    2

    AJAX Combo box

    my problem is that i have two combo box in asp.net .
    one combo box has keep information about country .
    second combo box has keep information about city .
    both combo box has populated from database .
    when i select any country from country combo box the second combo box (city

    ) has populatd from database without refreshing the page through AJAX.


    please give the solution .

    thanks

  2. #2
    Join Date
    Dec 2006
    Posts
    2

    suggested ajax solution

    Here's my best guess at a solution.
    1. Include the following general-purpose script. (It could be maintained as a separate file and included as follows:
    <script src="declareAndSendXmlHttpRequest.js"></script>)

    var _req // XmlHttpRequest

    function sendReq(page, qry, handler)
    {
    if (window.XMLHttpRequest)
    {
    _req = new XMLHttpRequest()
    }
    else if (window.ActiveXObject)
    {
    _req = new ActiveXObject("Microsoft.XMLHTTP")
    }
    else
    {
    alert ("Browser does not support HTTP Request.")
    return
    }
    _req.onReadyStateChange = handler
    var url = page + "?q=" + str
    _req.open("GET", url, true)
    _req.send(null)
    }

    2. In the combo box for Country, include the following:
    onChange="countryChanged(this.value)"

    In the city combo box, include the following:
    <option>Please select a country first.</option>

    3. Add a javascript function to handle when the country is selected:

    function countryChanged(country)
    {
    sendReq('myPage.aspx', country, 'cityListReturned')
    }


    4. In your server page, include capability to look up the list of cities based on the Country returned in the query string, e.g. ?q=UK. The returned text should be in the html format to fill the city combo box, e.g.
    <option>London</option>
    <option>Birmingham</option>
    <option>Liverpool</option>


    4a. Since the list of cities should be relatively static, you might want to save trips to the database by maintaining a self-populating object in the Application:

    Private Shared _cityList As DataTable
    Public Shared Function CityList(ByVal country As String) As String
    If _cityList Is Nothing Then
    Dim ds As DataSet = QueryForCompleteListOfCitiesAndCountries()
    _cityList = ds.Tables(0)
    End If
    Dim htmlList As String = ""
    Dim dv As New DataView(_cityList)
    dv.Filter = "country='" & country & "'"
    dv.Sort = "city"
    For c = 0 To dv.Items.Count - 1
    htmlList &= "<option>" & dv.Items(c)("city").ToString & "</option>" & vbCrLf
    Next
    Return htmlList
    End Function


    5. Add a javascript function to handle when the request returns the list of cities:

    function cityListReturned
    {
    if (_req.readyState == 4 || _req.readyState == "complete")
    {
    document.getElementById("city").innerHTML = _req.responseText
    }
    }


    (Caution: I've never done this -- just having fun trying to guess how to solve it.)
    Good luck!
    Last edited by kitwest; 12-27-2006 at 11:41 AM. Reason: improve readability

  3. #3
    Join Date
    Dec 2006
    Posts
    2

    code is not working

    your code is not working

Similar Threads

  1. Replies: 1
    Last Post: 04-09-2008, 07:28 AM
  2. Help with .Net combo box
    By jherndon in forum .NET
    Replies: 1
    Last Post: 12-23-2005, 11:05 AM
  3. Query help in Access Combo Box
    By Larry Muller in forum VB Classic
    Replies: 1
    Last Post: 02-24-2001, 10:12 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center
 
 
FAQ
Latest Articles
Java
.NET
XML
Database
Enterprise
Questions? Contact us.
C++
Web Development
Wireless
Latest Tips
Open Source


   Development Centers

   -- Android Development Center
   -- Cloud Development Project Center
   -- HTML5 Development Center
   -- Windows Mobile Development Center