ASP Using AJAX

AJAX Is Just JavaScript Talking to an ASP Page

AJAX (Asynchronous JavaScript And XML) is a browser technique, not a feature that ships with classic ASP. The browser runs ordinary JavaScript that sends a request to a URL in the background, and that URL can point to any .asp page on your server. The ASP page runs exactly like it would for a normal request — it just doesn't return a full HTML page.

There is no special "ASP AJAX" object, control, or library required. You write a small piece of client-side JavaScript using fetch or XMLHttpRequest, and a small piece of server-side ASP that reads a query string value and writes back plain data with Response.Write. The two sides communicate over plain HTTP, the same protocol the rest of the site already uses.

• A client-side script that builds a URL, sends the request, and handles the response
• A server-side .asp page that reads Request.QueryString (or Request.Form) and writes a short, plain response instead of a full page

<input type="text" id="productId" onchange="loadPrice(this.value)">
<span id="priceBox"></span>

<script>
function loadPrice(productId) {
  fetch("getprice.asp?id=" + encodeURIComponent(productId))
    .then(function(response) { return response.text(); })
    .then(function(price) {
      document.getElementById("priceBox").innerHTML = "Price: $" + price;
    })
    .catch(function() {
      document.getElementById("priceBox").innerHTML = "Could not load price.";
    });
}
</script>

<%
Response.ContentType = "text/plain"
Response.Buffer = True

Dim productId, price
productId = Request.QueryString("id")

Select Case productId
    Case "101"
        price = "19.99"
    Case "102"
        price = "24.50"
    Case Else
        price = "0.00"
End Select

Response.Write price
%>

Reading the Request and Writing the Response

• The JavaScript builds a URL with the value it needs to send, such as getprice.asp?id=101
• The browser sends that request in the background while the current page stays visible
• The ASP page reads the value with Request.QueryString("id")
• The ASP page looks up or calculates a result and sends it back with Response.Write
• The JavaScript callback receives the text and updates part of the page, such as a span or div

<script>
function loadPriceXHR(productId) {
  var xhr = new XMLHttpRequest();
  xhr.open("GET", "getprice.asp?id=" + encodeURIComponent(productId), true);
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      document.getElementById("priceBox").innerHTML = "Price: $" + xhr.responseText;
    }
  };
  xhr.send();
}
</script>

• Forgetting Response.ContentType, so the page returns HTML by default and extra markup ends up inside your text
• Not URL-encoding parameters with encodeURIComponent, which breaks values that contain spaces, & or other special characters
• Leaving Response.Buffer off, which can let partial output reach the browser before the script finishes
• Calling the .asp endpoint on a different domain and running into the browser's CORS restrictions