Tag Archives: AJAX

jQuery এর – AJAX এর ভূমিকা

Huge Sell on Popular Electronics

jQuery এর - AJAX এর ভূমিকা

মোঃ আরিফুল ইসলাম

 

পুরো পৃষ্ঠা রিলোড না করে সার্ভারের সাথে তথ্য বিনিময় করা এবং সেটি ওয়েব পেজ এর একটি অংশে আপডেট করা AJAX এর কাজ।

 

AJAX কি?

AJAX =JavaScript এবং XML এর সমন্বয়।

সংক্ষেপে, AJAX ওয়েব পেজ এর ব্যাকগ্রাউন্ড থেকে ডাটা লোড করে এবং সেটি ওয়েব পেজ এ প্রদর্শন করে। পুরো ওয়েব পেজকে রিলোড না করে।

AJAX ব্যবহার করে তৈরি করা কিছু ওয়েব অ্যাপ্লিকেশন এর উদাহরণ- Gmail, Google Maps, Youtube, and Facebook

 

JQuery এবং Ajax

Ajax এর ফাংশন Jquery এর কিছু মেথড ব্যাবহার করে।

jQuery AJAX মেথড থেকে আমরা যেকোন রিমোট সার্ভার ব্যাবহার করে যেকোন text, HTML, XML, অথবা JSON ফাইল কল করতে পারি। এছাড়াও বহিরাগত কোন নির্বাচিত HTML এলিমেন্টকে লোড করিয়ে ওয়েব পেজ এ প্রদর্শন করাতে পারি।

 

JQuery ছাড়া কি, AJAX এর কোডিং সুশৃঙ্খলভাবে কাজ করতে পারে

সচরাচর AJAX এর যে কোড লেখা হয় সেগুলিতেই AJAX এর কোডিং সুশৃঙ্খলভাবে কাজ করতে পারে। কারণ, বিভিন্ন ব্রাউজার এ AJAX এর সিনট্যাক্স ইমপ্লিমেন্ট করা আছে।

 

jQuery AJAX মেথড

পরবর্তী টিউটোরিয়াল এ আমরা jQuery AJAX মেথড সম্পর্ক এ জানবো।

 

jQuery – AJAX এর লোড মেথড । jQuery – AJAX load() Method

Huge Sell on Popular Electronics

প্রতাব চন্দ্র

 

জে’কুয়েরি load() মেথড একটি সাধারণ অথচ একটি শক্তিশালী অ্যাজাক্স মেথড।

লোড মেথড ওয়েব সার্ভার থেকে ডাটা বা তথ্য লোড করে এবং নির্দেশ করে দেয়া এলিমেন্টের ভেতর এই ডাটা স্থাপন করে।

সিনট্যাক্স (Syntax)


$(selector).load(URL,data,callback);

 

যে URL বা লিংক আপনি লোড করতে চান উপরের সিনট্যাক্সের “URL” প্যারামিটার এ সেটি দিতে হবে।

এখানে data প্যারামিটারটি ঐচ্ছিক। এটি কোনো রিকোয়েস্ট এর সাথে পাঠানোর জন্য querystring key/value সেট নির্ধারণ করে দেয়।

এখানে উল্লেখিত callback প্যারামিটারটিও ঐচ্ছিক বা optional । load() মেথড সম্পূর্ণ হবার পর যে ফাংশন কার্যকর (execute) হবে এটি সেই ফাংশনের নাম।

এখানে একটি উদারহণ দেওয়া হলো:


<h2>জে’কুয়েরি এবং অ্যাজাক্স মজার জিনিস!</h2>
<p id="p1">একটি প্যারাগ্রাফের ভিতর এখানে কিছু টেক্সট যোগ করা হয়</p>


 

নিচের উদাহরণটি "demo_test.txt" এর কনটেন্ট নির্দেশিত একটি <div> এলিমেন্টের ভেতর লোড করবে:


$("#div1").load("demo_test.txt");

ফলাফল : demo_test.txt

 

উল্লেখ্য, URL প্যারামিটারে jQuery সিলেক্টরও যোগ করা সম্ভব।

নিচের উদাহরণে "demo_test.txt" থেকে id="p1" নির্দেশিত এলিমেন্টের কনটেন্ট নির্ধারিত <div> এলিমেন্টের ভেতর লোড করবে।


$("#div1").load("demo_test.txt #p1");

ফলাফল : URL প্যারামিটারে jQuery সিলেক্টরও যোগ

 

ঐচ্ছিক callback প্যারামিটার একটি callback ফাংশন নির্দেশ করে যখন load() মেথডটি সম্পূর্ণ হয়। callback ফাংশন একাধিক প্যারামিটার ধারণ করতে পারে। যেমন-

  • responseTxt –যদি call সফল হয় তবে প্রাপ্ত কনটেন্ট ধারণ করে।
  • statusTxt - contains the status of the call এর পরিস্থিতি বা status ধারণ করে
  • xhr - XMLHttpRequest অবজেক্ট ধারণ করে

load() মেথড সম্পূর্ণ হবার পর একটি অ্যালার্ট বক্স প্রদর্শন করার প্রক্রিয়া নিচের উদাহরণে দেখানো হলো। যদি মেথড সফল হয় তাহলে এটি "External content loaded successfully!" বার্তা প্রদর্শন করবে। আর যদি ব্যর্থ হয় তবে error মেসেজ দেখাবে।
উদাহরণ:


$("button").click(function(){
    $("#div1").load("demo_test.txt", function(responseTxt, statusTxt, xhr){
        if(statusTxt == "success")
            alert("External content loaded successfully!");
        if(statusTxt == "error")
            alert("Error: " + xhr.status + ": " + xhr.statusText);
    });
});

ফলাফল : অ্যালার্ট বক্স প্রদর্শন করার প্রক্রিয়া

 

jQuery – AJAX এর noConflict() মেথড । jQuery – AJAX noConflict() Method

Huge Sell on Popular Electronics

মাহবুবুর রহমান

 

jQuery এবং অন্যান্য JavaScript ফ্রেমওয়ার্ক

ইতিমধ্যে আপনি যেনেছেন যে, jQuery তে $ চিহ্ন ব্যবহার করা হয় শর্টকাট হিসাবে।

বেশকিছু জনপ্রিয় জাভাস্ক্রিপ্ট ফ্রেমওয়ার্ক আছে, যেমন Angular, Backbone, Ember, Knockout ইত্যাদি।

যদি অন্য কোন জাভাস্ক্রিপ্ট ফ্রেমওয়ার্ক শর্টকাট হিসেবে $ ব্যবহার করে তাহলে কি ঘটবে?

যদি দুটি আলাদা ফ্রেমওয়ার্ক একই শর্টকাট ব্যবহার করে, তাহলে তাদের যেকোন একটির কাজ বন্ধ হয়ে যেতে পারে ।

ইতিমধ্যেই JQuery টিম এটি সম্পর্কে ভেবেছে, এবং noConflict() মেথড তৈরি করেছে।

 

JQuery এর noConflict() পদ্ধতি

noConflict() পদ্ধতি, $ শর্টকাট আইডেন্টিফায়ার রেখেই রিলিজ করেছে যাতে অন্য যে কোন স্ক্রিপ্টও এটি ব্যবহার করতে পারেন।

আপনি অবশ্যই এখনও শর্টকার্ট নাম এর পরিবর্তে পূর্ণ নাম ব্যবহার করে jQuery ব্যবহার করতে পারেন।


$.noConflict();
jQuery(document).ready(function(){
    jQuery("button").click(function(){
        jQuery("p").text("jQuery is still working!");
    });
});

ফলাফল : noConflict() পদ্ধতি

 

আপনি খুব সহজেই নিজেই নিজের শর্টকাট তৈরি করতে পারেন। noConflict() মেথড jQuery তে একটি রেফারেন্স ফেরত দেয়, যা আপনি পরবর্তীতে ব্যবহারের জন্য ভ্যারিয়েবল হিসেবে সংরক্ষণ করে রাখতে পারেন।

উদাহরণ


var jq = $.noConflict();
jq(document).ready(function(){
    jq("button").click(function(){
        jq("p").text("jQuery is still working!");
    });
});

ফলাফল : শর্টকাট তৈরি

 

যদি আপনার একটি jQuery code ব্লক থাকে এবং আপনি এটিকে পরিবর্তন করতে না চান, তাহলে আপনি  আপনি ready মেথড ব্যবহার করে $ সাইন পারামিটার হিসাবে ব্যবহার করতে পারেন। এটি jQuery এর ফাংশনের ভিতরে $ সাইন ব্যবহারের অনুমতি দেয় - এর বাহিরে আপনাকে jQuery ব্যবহার করতে হবে।

উদাহরণ


$.noConflict();
jQuery(document).ready(function($){
    $("button").click(function(){
        $("p").text("jQuery is still working!");
    });
});

ফলাফল : ready মেথড

jQuery – AJAX এর get() and post() মেথড । jQuery – AJAX get() and post() Methods

Huge Sell on Popular Electronics

অনুবাদক: ফয়সাল রকি

 

জেকুয়েরি - এজাক্স get() এবং post() পদ্ধতি ব্যবহার করে HTTP GET বা POST request বা অনুেরাধ-এর মাধ্যমে সার্ভারে data request পাঠানো হয়।

HTTP request: GET বনাম POST

ক্লাইন্ট ও সার্ভারের মধ্যকার request ও response এর জন্য বহুল ব্যবহৃত পদ্ধতি দুটি হলো GET ও POST.

GET: নির্দিষ্ট কোনো resource হতে data request পাঠানো হয়।

POST: নির্দিষ্ট কোনো resource এ data process এর উদ্দেশ্যে পাঠানো হয়।

মূলতঃ সার্ভার হতে কোনো data পুনরুদ্ধার করাই হলো GET এর কাজ। উল্লেখ্য যে, GET এর মাধ্যমে data পুনরুদ্ধারের ক্ষেত্রে অনেক সময় cached data দেখাতে পারে।
POST এর মাধ্যমেও সার্ভার হতে data পুনরুদ্ধার করা যায়। তবে POST এর পদ্ধতির ক্ষেত্রে কখনো cached data দেখায় না এবং প্রায় সময়ই data পাঠানোর ক্ষেত্রে request সহ প্রেরণ করা হয়।

GET ও POST সম্বন্ধে বিস্তারিত জানতে এবং উভয়ের পার্থক্য জানতে "HTTP পদ্ধতি: GET বনাম POST" অধ্যায়টি পড়ুন।

jQuery $.get() পদ্ধতি

এই $.get() পদ্ধতিতে HTTP GET request এর সাথে সার্ভারে data request পাঠানো হয়।
সিনট্যাক্স:


$.get(URL,callback);


required বা প্রয়োজনীয় URL parameter বা URL এর মানদন্ডটি আপনার পাঠানো এর URL request কে নির্দেশ করে।

optional callback parameter টি এমন একটি ফাংশন যা request টি সফল হলে কাজ করে।

নিম্নোক্ত উদাহরণে $.get() পদ্ধতির সাহায্যে সার্ভার হতে একটি ফাইল পুনরুদ্ধার দেখানো হলো।


$("button").click(function(){
    $.get("demo_test.asp", function(data, status){
        alert("Data: " + data + "\nStatus: " + status);
    });
});

ফলাফল : $.get() পদ্ধতির সাহায্যে সার্ভার হতে একটি ফাইল পুনরুদ্ধার

$.get() এর প্রথম parameter টি আপনার পাঠানো এর URL request কে নির্দেশ করে ("demo_test.asp").

দ্বিতীয় parameter টি একটি callback ফাংশন। প্রথম callback parameter টি request কৃত page এর content কে নির্দেশ করে এবং দ্বিতীয় callback parameter টি request এর status কে নির্দেশ করে।

টিপ: এখানে ASP file এর একটা উদাহরণ দেয়া হলো ("demo_test.asp")


<%
 response.write("This is some text from an external ASP file.")
 %>

 

jQuery $.post() পদ্ধতি

$.post() পদ্ধতিতে HTTP POST request এর সাথে সার্ভারে data request পাঠানো হয়।

সিনট্যাক্স


$.post(URL,data,callback);

 

required বা প্রয়োজনীয় URL parameter বা URL এর মানদন্ডটি আপনার পাঠানো এর URL request কে নির্দেশ করে।

optional data parameter টি নির্দিষ্ট কিছু data কে নির্দেশ করে যা request এর সাথে পাঠানো হয়।

optional callback parameter টি এমন একটি ফাংশন যা request টি সফল হলে কাজ করে।

নিম্নোক্ত উদাহরণে $.post() পদ্ধতির সাহায্যে request এর সাথে নির্দিষ্ট কিছু data পাঠানো দেখানো হলো।

উদাহরণ:


$("button").click(function(){
    $.post("demo_test_post.asp",
    {
        name: "Donald Duck",
        city: "Duckburg"
    },
    function(data, status){
        alert("Data: " + data + "\nStatus: " + status);
    });
});

ফলাফল : $.post()

 

$.post() এর প্রথম parameter টি আপনার পাঠানো URL request কে নির্দেশ করে ("demo_test_post.asp").

অতঃপর আমরা কিছু data (নাম ও শহর) request এর সাথে send করি।

"demo_test_post.asp" এর ASP script parameter গুলোকে read করে, process করে এবং একটি ফলাফল return করে।

তৃতীয় parameter টি একটি callback ফাংশন। প্রথম callback parameter টি request কৃত page এর content কে নির্দেশ করে এবং দ্বিতীয় callback parameter টি request এর status কে নির্দেশ করে।

টিপ: এখানে ASP file এর একটা উদাহরণ দেয়া হলো ("demo_test_post.asp"):


<%
 dim fname,city
 fname=Request.Form("name")
 city=Request.Form("city")
 Response.Write("Dear " & fname & ". ")
 Response.Write("Hope you live well in " & city & ".")
 %>

 

 

AJAX

Huge Sell on Popular Electronics

AJAX
--------
ওয়েবে, ওয়েব ডেভেলপার থেকে শুরু করে সাধারণ ব্যবহারকারি পর্যন্ত, সবার কাছে গত কয়েক বছর ধরে যে শব্দটি গুঞ্জনে পরিণত হয়েছে তা হচ্ছে AJAX . হাজারো ওয়েব application তৈরি হয়েছে ও হচ্ছে এই প্রযুক্তির উপর ভিত্তি করে। কিন্তু কী এই AJAX ?
Ajax = পুরোন প্রযুক্তির নতুন ব্যবহার

Ajax এর পুরো অর্থ হচ্ছে Asynchronous JavaScript and XML. Ajax কোন প্রোগামিং ল্যাংগুয়েজ নয় বরং এটি একটি প্রযুক্তি। একটি প্রযুক্তি বলা ভুল হবে বরং ওয়েব ডেডেলপমেন্টে ব্যবহৃত হয় এমন কতগুলো প্রযুক্তির সমষ্টি মাত্র। XHTML, CSS, DOM , XML, JavaScript এই প্রযুক্তি গুলো ওয়েব ডেভেলপমেন্টের ক্ষেত্রে এমনিতেই ব্যবহৃত হয়। আর Ajax হচ্ছে এই প্রযুক্তি গুলো মিলিয়ে তৈরি একটি নতুন প্রযুক্তি।
AJAX এর নাম করণ

জেসি জেমস গ্যারেট, ২০০৫ সালের ১৮ অক্টোবরে তার প্রকাশিত লেখা Ajax: A New Approach to Web Applications মাধ্যমে সর্বপ্রথম Ajax এর নামকরণ করেন। অর্থাৎ এজাক্স শুধু নামেই নতুন, এজাক্স -এই শব্দটি ওয়েবে আসার আগেই গুগল ম্যাপ, গুগল সাজেস্ট অ্যাপলিকেশন গুলো তৈরি হয়। গ্যারেটের নাম করণের মাধ্যমে AJAX তার একটি নিজেস্ব নাম পায়। যে সব টেকনোলজি নিয়ে এজাক্স গঠিত সেগুলো ওয়েবে আগেই ব্যবহৃত হত এবং এখনও ব্যবহৃত হয়।

সিলিকনভেলির ওয়েব ডেভেলপমেন্ট ফার্মের ডাইরেক্টর গ্যারেট তার লেখায় বলেন যে, এজাক্স মূলত পাঁচটি প্রযুক্তির সমন্বয়ে গঠিত। আসুন দেখি গ্যারেট তার লেখায় Ajax কে কী ভাবে বর্ণনা করেছেন।
তার আগে বুঝে নিন

ওয়েব পেইজে আমার যখন কোন লিংককে ক্লিক বা কোন ফরম সাবমিট করি তখন আপনার browser টি server কে বলে আমাকে অমুক পেইজটি দাও বা অমুক কাজটি কর এই প্রক্রিয়াটিকে বলে request পাঠানো। আর ওয়েব সার্ভার আপনার browser এই request গ্রহন করে উত্তর সরূপ আপনাকে পাঠায় আপনার কাঙ্ক্ষিত পেইজ। একে বলে response দেওয়া। অর্থাৎ browser, server কে request পাঠায় আর সার্ভার তা process করে তার response আবার Browser কে পাঠায়। তবে উল্টোও ঘটতে পারে। শুধু এতটুকু বুঝে নিন যে browser request পাঠায় আর server পাঠায় response।

Ajax -এ যে যে প্রযুক্তি যে জন্য ব্যবহৃত হয়

XHTML ও CSS:

এজেক্স এ XHTML ও CSS দিয়ে অ্যাপলিকেশনের Interface তৈরি করা হয়। XHTML হচ্ছে HTML এর Latest ভাসর্ন এতে কিছু নতুন Specification ( HTML কোড লেখার নিয়মনীতির ) পরিবর্তন ও সুনির্দিষ্ট করা হয়েছে মূল HTML এর আমূল কোন পরিবর্তন নয়। আর CSS হচ্ছে Style Sheet যার মাধ্যমে HTML এর বিভিন্ন উপাদানকে নিয়ন্ত্রন করা হয় এবং Style প্রদান করা হয়।

DOM বা Document Object Model:

User Interface -এর যে কোন স্থান বা অংশ যখন পরিবর্তন করা হয় বা পরিবর্তন করার প্রয়োজন হয় যেমন নতুন কোন Block যুক্ত করা বা নির্দিষ্ট কোন অংশে ( DIV -এ ) নতুন কোন information বা element যুক্ত করা, গ্যারেট এর লেখা অনুযায়ী এর পরিবর্তন করার জন্য Ajax এ ব্যবহৃত হয় DOM বা Document Object Model. DOM বা Document Object Model হচ্ছে এমন একটি Application Interface যা বেশির ভাগ ব্রাউজার সাপোর্ট করে এবং যার মাধ্যমে ব্রাউজারে - এ visible এমন উপাদান গুলোকে পরিবর্তনের মাধ্যমে User Interface পরিবর্তন করা যায়।

XML বা Extensible Markup Language:

গ্যারেটের মতে Ajax প্রযুক্তিতে সার্ভার ও ব্রাউজারের মধ্যে সকল ডেটা আদান প্রদান করে XML format -এ। XML হচ্ছে HTML এর মত একটি Markup Language. HTML -এ এর Markup গুলো নির্দিষ্ট করা যেমন <p>, <a>, <span> ইত্যাদি। HTML লেখতে হলে আপনাকে এই নির্দিষ্ট tag গুলোই ব্যবহার করতে হবে। আর XML -এর আপনি আপনার নিজের ইচ্ছা মতো tag তৈরি ও ব্যবহার করতে পারবেন যেমন <product>, <id>, <item> তবে HTMLও XML কিন্তু একে অন্যের replacement নয়। HTML এর কাজ Information Display করা আর XML এর কাজ হচ্ছে data বা information carry করা। দুটোর উদ্দেশ্য আলাদা আলাদা।

XMLHttp:

উপরে যা বুঝেছিলেন তা এখন কাজে লাগান। সাধারণ ভাবে ওয়েব সার্ভারে কোন Request পাঠানো হলে সেই response এর result দেখাতে পুরো ওয়েব পেইজটি refresh হওয়ার প্রয়োজন হয়। অর্থাৎ পুরো interface টি hypered হয় বা বলতে পারেন লাফ দেয়। Ajax প্রযুক্তি মূল উদ্দেশ্যই হচ্ছে hyped Interface থেকে মুক্তি দেওয়া, অর্থাৎ পুরো UI ( User Interface ) এর কোন রকম পরিবর্তন না ঘটিয়ে সম্পূর্ণ background -এ বা asynchronously browser থেকে server এ request পাঠানো এবং ব্রাউজের পাঠানো request process করে response পাঠানো। Asynchronous মানে হচ্ছে ব্রাউজার কর্তৃক পাঠানো কোন request এর respond এর জন্য অপেক্ষা না করে তা background -এ সম্পন্ন করা। আর এ কাজের জন্য ব্যবহা করা হয় XMLHttp.XMLHttp হচ্ছে বেশিরভাগ ব্রাউজার সাপোর্ট করে এমন একটি object (যদিও IE6 করে না)। যার মাধ্যমে browser, server -এর process জন্য যে কোন request পাঠিয়ে তার responce পেতে পারে।

Javascripts:

Javascript এই সব কিছুকে এক সাথে বেঁধে ফেলে। ছবিটি দেখে মিলিয়ে মিলিয়ে পড়ুন তাহলে বুঝতে সুবিধাহবে।

(১) Javascript user এর interaction ( click, submit, keypress ) monitor করে। যেমন কোন ক্লিক হল কিনা, কোন ফর্ম সাবমিট বা keypress হল কিনা।(২) হলে, Javascript, serverএর সাথে communicate করার জন্য XMLHttp request তৈরি ও সক্রিয় করে। (৩) এরপর Javascript, ব্রাউজার কতৃক পাঠানো প্রয়োজনীয় information, XML format এ পাঠানোর জন্য এক সাথে package করে সার্ভারে পাঠায় । (৪) Javascript XHTML ও CSS দিয়ে তৈরি করা ইন্টারফেসের প্রয়োজনীয় অংশ DOM Access এর মাধ্যমে পরিবর্তন করে (৫) user কে জানান দেয় যে request সফল হয়েছে কি হয় নি।
কিন্তু

AJAX এর এই ধারণা বা মডেলটি গ্যারেট তার Article-এ পেশ করেন। গ্যারেটের এই AJAX মডেলটি Ajax এর একদম মৌলিক মডেল। যদিও গ্যারেটেই প্রথম Ajax এর মৌলিক মডেল প্রদান করেন এবং এর নাম করণ করেন কিন্তু তা পরিপূর্ণ নয়। গ্যারেট AJAX এর যে মডেল ও নাম করণ করেন তার মধ্যে বেশ কিছু সীমাবদ্ধতা আছে যার মাধ্যমে Ajax -এ ক্ষমতা পরিপূর্ণ ভাবে প্রকাশ পায় না।

2.http://salearningschool.com/

অ্যাজাক্স পরিচিতি (AJAX Introduction)

Huge Sell on Popular Electronics

শেখ মাহফুজুর রহমান

একটি ওয়েব পেজ পুরোটা রিলোড না করে পেজের একটি অংশকে আপডেট করার প্রক্রিয়াই হলো অ্যাজাক্স।

 

অ্যাজাক্স কি?

AJAX এর মানে হলো Asynchronous JavaScript and XML । অ্যাজাক্স হলো ফাস্ট এবং ডাইনামিক ওয়েব পেজ তৈরির একটি কৌশল। অ্যাজাক্স ওয়েব পেজকে অ্যাসিংক্রোনাসলি (asynchronously) সার্ভারের সাথে সামান্য পরিমাণ ডাটা বিনিময় (--) করেই আপডেট করতে সাহাজ্য করে। এর মানে হলো একটি পেজকে পুরোপুরি লোড না করে পেজের একটি অংশকে আপডেট করা সম্ভব। ক্লাসিক ওয়েব পেজগুলোতে, যেগুলো অ্যাজাক্স ব্যবহার করেনা, কন্টেন্ট পরিবর্তন করার পর পরিবর্তিত পেজকে পেতে চাইলে অবশ্যই তা রিলোড করতে হবে।
অ্যাজাক্স ব্যবহারকারী অ্যাপ্লিকেশনের উদাহরন হলোঃ গুগল ম্যাপ, জিমেইল, ইউটিউব এবং ফেসবুক ট্যাব।

কিভাবে অ্যাজাক্স কাজ করে

১)ব্রাউজারঃ
একটি ইভেন্ট তৈরি হয়...
একটি XMLHttpRequest অবজেক্ট তৈরি করা হয়
HttpRequest পাঠানো হয়

---->> ইন্টারনেট ---->>

২) সার্ভার
HttpRequest কে প্রসেস করে
একটি রেসপন্স তৈরি করে এবং সেই ডাটা ব্রাউজারে প্রেরণ করে

---->> ইন্টারনেট ---->>

৩) ব্রাউজার
ফেরত আসা ডাটাগুলো প্রসেস করে
পেজের কন্টেন্ট আপডেট করে

 

ইন্টারনেট স্ট্যান্ডার্ড নির্ভর অ্যাজাক্স

ইন্টারনেট স্ট্যান্ডার্ডের উপর নির্ভর করে অ্যাজাক্স কাজ করে এবং নিচের কম্বিনেশনগুলো ব্যবহার করেঃ

  • XMLHttpRequest অবজেক্ট (সার্ভারের সাথে অ্যাসিংক্রোনাসলি ডাটা বিনিময় করার জন্য)
  • জাভাস্ক্রিপ্ট/DOM (তথ্যকে দেখানো/ইন্টারেক্ট করতে)
  • সিএসএস (ডাটাকে স্টাইল করতে)
  • এক্সএমএল (বিনিময়কৃত ডাটা ফরমেট হিএবে ব্যবহৃত হয়)

নোটঃ অ্যাজাক্স অ্যপ্লিকেশনগুলো ব্রাউজার এবং প্লাটফর্ম ইন্ডিপেন্ডেন্ট হয়ে থাকে অর্থাৎ যেকোন প্লাটফর্মে অ্যাজাক্স কার্যকর।

 

গুগল সাজেস্ট

অ্যাজাক্স ২০০৫ সালে Google Suggest অ্যাপ্লিকেশনে ব্যবহার হওয়ার মাধ্যমে গুগলের হাত ধরে জনপ্রিয় হয়েছিল।

Google Suggest ডাইনামিক ওয়েব ইন্টারফেস তৈরি করতে অ্যাজাক্স ব্যবহার করছেঃ যখন আপনি গুগলের সার্চ বক্সে কিছু টাইপ করেন, একটি জাভাস্ক্রিপ্ট অক্ষরগুলোকে সার্ভারে পাঠায় এবং সার্ভার একটি সাজেশন লিস্ট পাঠিয়ে দেয় যা আপনি দেখতে পান।

আজকেই অ্যাজাক্স ব্যবহার শুরু করুন

আমাদের পিএইচপি টিউটরিয়ালে আমরা ব্যাখ্যা করবো কিভাবে অ্যাজাক্স একটি ওয়েব পেজের পুরোটা রিলোড না করে পেজের একটি অংশকে আপডেট করতে পারে। সার্ভার স্ক্রিপ্টটি পিএইচপি'তে লেখা হবে। অ্যাজাক্স সম্পর্কে আরও বেশি জানতে চাইলে আমাদের অ্যাজাক্স টিউটোরিয়ালটি ভিজিট করুন।