SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    Jun 2004
    Location
    Montreal
    Posts
    275
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Calling AJAX Request to update 2 differents dropbox

    Hi,

    I was wondering how could we call a request that should refresh 2 differents dropbox on different part of a page, without having to refresh everything.

    I've got an author list, an article title list and a tutorial list. Each list are inside dropboxes.

    When a user select an author, I want to be able to refresh both articles & tutorial dropbox?

    Is there any way to do this?

    thank

  2. #2
    SitePoint Evangelist hexburner's Avatar
    Join Date
    Jan 2007
    Location
    Belgium
    Posts
    591
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code JavaScript:
    function updateLists () {
        var authorList = document.getElementById('authors');
        var author = authorList.options[authorList.selectedIndex];
     
        // Do your AJAX request here to retrieve articles and tutorials
        // var articles contains the articles for the selected author
        // var tutorials contains the tutorials for the selected author
     
             populateList('articles', articles);
             populateList('tutorials', tutorials);
    }
     
    function populateList (id, collection) {
             var listObj = document.getElementById(id);
             listObj.innerHTML = '';
             if (collection.length > 0) {
                     for (i=0; i<collection.length; i++) {
                             var option = document.createElement('option');
                             option.value = listObj[i]['id'];
                             option.innerHTML = listObj[i]['Title'];
                             listObj.appendChild(option);
                     }
                     return;
             }
             var option = document.createElement('option');
             option.innerHTML = 'There are no ' + id + ' available for this author';
             listObj.appendChild(option);
    }

    Code HTML4Strict:
     <select name="authors" id="authors" onchange="updateLists();">
             <option value="1">Author 1</option>
             <option value="2">Author 2</option>
             <option value="3">Author 3</option>
    </select>
     
    <select name="articles" id="articles">
             <option value="0">Select an author</option>
    </select>
     
    <select name="tutorials" id="tutorials">
             <option value="0">Select an author</option>
    </select>
    FOR SALE: 1 set of morals, never used, will sell cheap

  3. #3
    SitePoint Addict
    Join Date
    Jun 2004
    Location
    Montreal
    Posts
    275
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank alot for this nice and clean sample .... now I know how to do it


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
  •