এজ্যাক্স (Ajax)

এজ্যাক্স একজন ওয়েভ ডেভেলপার এর কাছে খুবই গুরুত্ব পুর্ণ একটি শব্দ। আর বর্তমানে এটি ছাড়া প্রায় চলে না ডেভেলপারদের । কারণ Ajax এর মাধমে একজন ডেভেলপার পারেন পেইজ রিলোড করা ছাড়া পেইজে ডাটা লোড করাতে , সার্ভার থেকে ডাটা রিড করতে, ওয়েভ সার্ভারে ডাটা পাঠাতে, বিভিন্ন ফর্মমেটে ডাটা রিড করতেও এটি সাহায্য করে থাকে। তাই বলতে গেলে আপনি যদি ওয়েভ ডেভেলপার হন তাহলে Ajax এর ব্যবহার আপনাকে কোন না কোন ভাবে করতেই হবে ।

আসেন তাহলে আমরা একটু উদাহরন এর মাধ্যমে দেখার চেষ্টা করে দেখি

function readData(method,url) {
  const xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
     console.log(this.responseText);
    }
  };
  xhttp.open(method, url, true);
  xhttp.send();
}

এখানে যা ঘটেছে তা একটু বুঝে নেই ।

এখানে আমি যা করেছি তা হলো আমি একটা ফাংশন বানিয়েছি যেখানে আমি দুই টা প্যারামিটার পাস করেছি method [GET,POST ...etc] ও url নামে । এর পর আমি xhttp নামে একটি অবজেক্ট বানিয়েছি । এরপর xhttp থেকে onreadystatechange নামে মেথডে কন্ডিশন চালিয়ে চেক করে নিলাম readyState 4 এবং status 200 কিনা যদি হয় তাহলে console.log() এই মেথড এর মাধ্যমে রেস্পন্স কে দেখানো হয়েছে তারপর xhttp থেকে open মেথড এ method,url ,true[বিদ্রঃ true value টি async এর জন্য এটা false করে দিলে sync এর অনুসারে কাজ করে ] এর পর xhttp থেকে request send করা হয়েছে ।