output dynamic data without a page-refresh

Hi,
I have created a simple ASP webpage which pulls data from an 'outlet' table. This table has two columns (outletID, outletName).

What i want the webpage to do is allow a user to type an outletID into a text input-box, and then for the corresponding outletName to appear next to the input box.

This seems straighforward except that i want this to happen automatically, and without the page refreshing. I think this is possible with JS, but i'm not sure how?!?

Any help or ideas would be very welcome.

Thanks!

 

This is possible with ajax.

(Code untested, I wrote it in the text box)

var url = 'ajax.asp?outletid=';

function receive_name()
{ 
      var outletid = document.getElementById('outletid').getAttribute('value');
      var xhttp = window.XMLHttpRequest ? new XMMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
      xhttp.open('GET', url + outletid);
      xhttp.onreadystatechange = function()
      {
           if (xhttp.readyState == 1)
           {
              document.getElementById('response').innerHTML = 'Loading, please wait...';
           }
           else if (xhttp.readyState == 4 && xhttp.status == 200)
           {
                 document.getElementById('response').innerHTML = xhttp.responseText);
           }
       }
       xhttp.send(null);
}

Code (javascript):

So what you need now is a page called ajax.asp for example, and it has to be able to receive the outlet ID by GET method, and simply output the name to it. I can't you help with this part as I don't know ASP. I could do that with PHP...

Then the HTML should look like this more or less.

Outlet ID: <input type="text" id="outletid" />
<input type="button" onclick="receive_name()" value="Get name" />
<div id="response"></div>

HTML:

And that's it basically...

 

i am not sure but there is a control autocompletor control in asp.net 2005