AJAX ਸਰਵਸਾਧਾਰਨ

AJAX ਦਾਤਾਰੂ ਹੈ ਕਿਉਂਕਿ ਤੁਸੀਂ ਇਹ ਕਰ ਸਕਦੇ ਹੋ:

  • ਪੇਜ ਨੂੰ ਤਾਜ਼ਾ ਕਰੋ ਬਿਨਾ ਸਰਵਰ ਨੂੰ ਤਾਜ਼ਾ ਕਰੋ
  • ਪੇਜ ਲੋਡ ਹੋਣ ਦੇ ਬਾਅਦ ਸਰਵਰ ਤੋਂ ਡਾਟਾ ਮੰਗੋ
  • ਪੇਜ ਲੋਡ ਹੋਣ ਦੇ ਬਾਅਦ ਸਰਵਰ ਤੋਂ ਡਾਟਾ ਪ੍ਰਾਪਤ ਕਰੋ
  • ਪਿੱਛੇ ਹਿੱਸੇ ਵਿੱਚ ਸਰਵਰ ਨੂੰ ਡਾਟਾ ਭੇਜੋ

AJAX ਉਦਾਹਰਣ

ਹੇਠ ਦਾ ਬਟਨ ਕਲਿੱਕ ਕਰ ਕੇ ਇਸ ਟੈਕਸਟ ਨੂੰ AJAX ਦੁਆਰਾ ਬਦਲੋ:

ਸਵੈ ਮੁਹਾਰਤ ਕਰੋ

AJAX ਉਦਾਹਰਣ ਵਿਸਥਾਰ

HTML ਪੇਜ

<!DOCTYPE html>
<html>
<body>
<div id="demo">
  <h2>ਇਸ ਟੈਕਸਟ ਨੂੰ AJAX ਦੁਆਰਾ ਬਦਲੋ</h2>
  <button type="button" onclick="loadDoc()">ਟੈਕਸਟ ਬਦਲੋ</button>
</div>
</body>
</html>

ਇਹ HTML ਪੇਜ ਇੱਕ <div> ਅਤੇ ਇੱਕ <button> ਸਮੇਤ ਹੈ。

<div> ਸਰਵਰ ਤੋਂ ਮਿਲੀ ਸੂਚਨਾ ਦਿਸਾਉਣ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ。

<button> ਫੰਕਸ਼ਨ ਚਾਲੂ ਕਰੋ (ਜਦੋਂ ਇਹ ਕਲਿੱਕ ਕੀਤਾ ਜਾਵੇ)。

ਇਹ ਫੰਕਸ਼ਨ web ਸਰਵਰ ਤੋਂ ਡਾਟਾ ਮੰਗਦਾ ਹੈ ਅਤੇ ਇਸ ਨੂੰ ਦਿਸਾਉਂਦਾ ਹੈ:

Function loadDoc()
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
     document.getElementById("demo").innerHTML = this.responseText;
    }
  };
  xhttp.open("GET", "ajax_info.txt", true);
  xhttp.send();
}

ਕੀ AJAX ਹੈ?

AJAX = Asynchronous JavaScript And XML.

AJAX ਇੱਕ ਪ੍ਰੋਗਰਾਮਿੰਗ ਲੈਂਗਵੇਜ ਨਹੀਂ ਹੈ।

AJAX ਸਿਰਫ਼ ਇਹ ਕੰਮ ਕਰਦਾ ਹੈ:

  • ਬਰਾਊਜ਼ਰ ਵਿੱਚ ਬੁਣਿਆ ਹੋਇਆ XMLHttpRequest ਆਬਜੈਕਟ (ਵੈੱਬ ਸਰਵਰ ਤੋਂ ਸਮਾਚਾਰ ਲੈਣਾ)
  • JavaScript ਅਤੇ HTML DOM (ਪ੍ਰਦਰਸ਼ਨ ਜਾਂ ਵਰਤੋਂ ਵਿੱਚ ਸਮਾਚਾਰ)

Ajax ਇੱਕ ਗਲਤ ਨਾਮ ਹੈ।Ajax ਐਪਲੀਕੇਸ਼ਨ ਵਿੱਚ XML ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹਨ, ਪਰ ਪ੍ਰਾਣਤਾਪੂਰਣ ਟੈਕਸਟ ਜਾਂ JSON ਟੈਕਸਟ ਦੀ ਵਰਤੋਂ ਵੀ ਆਮ ਹੈ。

Ajax ਵੈਬ ਸਰਵਰ ਦੇ ਪਿੱਛੇ ਦੇ ਵਿਚਕਾਰ ਸੁਚਾਰੂ ਰੂਪ ਨਾਲ ਅਦਾਨ-ਪ੍ਰਦਾਨ ਕਰਨ ਦੀ ਇਜਾਜਤ ਦਿੰਦਾ ਹੈ।ਇਹ ਮਤਲਬ ਹੈ ਕਿ ਪੰਨੇ ਦਾ ਕੁਝ ਹਿੱਸਾ ਅੱਪਡੇਟ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ, ਜਦੋਂ ਤੱਕ ਪੂਰੇ ਪੰਨੇ ਫਿਰ ਤੋਂ ਲੋਡ ਨਹੀਂ ਕੀਤਾ ਜਾਂਦਾ ਹੈ。

AJAX ਕਿਵੇਂ ਕੰਮ ਕਰਦਾ ਹੈ

AJAX
  1. ਵੈੱਬ ਵਿੱਚ ਇੱਕ ਈਵੈਂਟ ਹੋਇਆ (ਪੰਨਾ ਲੋਡ ਕਰਨਾ, ਬਟਨ ਕਲਿੱਕ ਕਰਨਾ)
  2. JavaScript ਰਾਹੀਂ XMLHttpRequest ਆਬਜੈਕਟ ਬਣਾਉਣਾ
  3. XMLHttpRequest ਆਬਜੈਕਟ ਵੈੱਬ ਸਰਵਰ ਨੂੰ ਬੇਨਤੀ ਭੇਜਦਾ ਹੈ
  4. ਸਰਵਰ ਪ੍ਰਾਰਭ ਪ੍ਰਾਰਭ ਨੂੰ ਪ੍ਰਸ਼ਾਸਤ ਕਰਦਾ ਹੈ
  5. ਸਰਵਰ ਪ੍ਰਤੀਕਿਰਿਆ ਨੂੰ ਵੈੱਬ ਪੰਨੇ ਵਿੱਚ ਭੇਜਦਾ ਹੈ
  6. JavaScript ਰਾਹੀਂ ਪ੍ਰਤੀਕਿਰਿਆ ਪ੍ਰਾਪਤ ਕਰਨਾ
  7. JavaScript ਰਾਹੀਂ ਸਹੀ ਕਾਰਵਾਈ (ਉਦਾਹਰਣ ਵਜੋਂ ਪੰਨਾ ਅੱਪਡੇਟ ਕਰਨਾ)