জেকুয়েরি জাভাস্ক্রিপ্ট এঙ্গুলার এইচটিএমএল সিএসএস বুটস্ট্রাপ
ফোরাম
 

জেকুয়েরি ajax() মেথড


« জেকুয়েরি অ্যাজাক্স মেথডসমূহ


সংজ্ঞা এবং ব্যবহার

অ্যাজাক্স রিকুয়েস্ট কার্যকর করতে ajax() মেথড ব্যবহার করা হয়।

সকল জেকুয়েরি অ্যাজাক্স মেথড ajax() মেথডটি ব্যবহার করে। এই মেথডটি বেশিরভাগ ক্ষেত্রে রিকুয়েস্টের জন্য ব্যবহার করা হয় যেখানে অন্যান্য মেথড ব্যবহার করা যায় না।


সিনট্যাক্স ও ব্যাখ্যা

$.ajax({name:value, name:value, ... })

অ্যাজাক্স রিকুয়েস্টের জন্য প্যারামিটার এক বা একাধিক name/value জোড়া নির্দেশ করে।

সম্ভাব্য names/values নিচের টেবিলে দেওয়া হলো:

নাম ভ্যালু/বিবরণ
async রিকুয়েস্টটি অ্যাসিঙ্ক্রোনাস হবে কি হবে না তা একটি বুলিয়ান ভ্যালুর মাধ্যমে নির্দেশ করে। ডিফল্ট ভ্যালু হলো true
beforeSend(xhr) রিকুয়েস্ট পাঠানোর পূর্বে একটি ফাংশন রান হবে।
cache রিকুয়েস্টেকৃত পেজ ব্রাউজার ক্যাশ করবে কি করবে না তা একটি বুলিয়ান ভ্যালুর মাধ্যমে নির্দেশ করে। ডিফল্ট ভ্যালু হলো true
complete(xhr,status) রিকুয়েস্ট সম্পন্ন হওয়ার পর একটি ফাংশন রান হবে।
contentType সার্ভারে ডাটা পাঠানোর সময় কন্টেন্ট টাইপ ব্যবহার করা হয়। ডিফল্টটি হলো: "application/x-www-form-urlencoded"
context অ্যাজাক্স সম্পর্কিত সকল কলব্যাক ফাংশনের জন্য "this" ভ্যালুকে নির্দেশ করে।
data সার্ভারে পাঠানো ডাটাকে নির্দেশ করে।
dataFilter(data,type) XMLHttpRequest রিকুয়েস্টের র রেস্পন্স ডাটা হ্যান্ডেল করতে একটি ফাংশন ব্যবহার করে।
dataType সার্ভার রেস্পন্সের কাঙ্খিত ডাটাটাইপ।
error(xhr,status,error) রিকুয়েস্ট ব্যর্থ হলে একটি ফাংশন রান হবে।
global রিকুয়েস্টের জন্য গ্লোবাল অ্যাজাক্স ইভেন্ট হ্যান্ডলার সক্রিয় হবে কি হবে না তার একটি বুলিয়ান ভ্যালু নির্দেশ করে। ডিফল্ট ভ্যালু হলো true
ifModified একটি বুলিয়ান ভ্যালু নির্দেশ করে রিকুয়েস্টটি সম্পন্ন হবে যদি পূর্ববর্তী রিকুয়েস্টের রেস্পন্স থেকে বর্তমানটি পরিবর্তিত হয়। ডিফল্ট ভ্যালু false
jsonp একটি jsonp রিকুয়েস্টে কলব্যাক ফাংশনকে একটি স্ট্রিং দ্বারা বাদ দেওয়া।
jsonpCallback একটি jsonp রিকুয়েস্টে কলব্যাক ফাংশনের একটি নাম নির্দেশ করে।
password HTTP এক্সেস অথেন্টিকেশন রিকুয়েস্টে একটি পাসওয়ার্ড ব্যবহার করতে হবে তা নির্দেশ করে।
processData একটি বুলিয়ান ভ্যালু দ্বারা নির্দেশ করে যে রিকুয়েস্টের সাথে পাঠানো ডাটা জেকুয়েরি স্ট্রিংয়ে রুপান্তরিত হবে কি হবে না। ডিফল্ট ভ্যালু true
scriptCharset রিকুয়েস্টের ক্যারেক্টারসেট নির্দেশ করে
success(result,status,xhr) রিকুয়েস্ট সফল হলে একটি ফাংশন রান হবে
timeout রিকুয়েস্টের লোকাল টাইমআউট(মিলিসেকেন্ডে)
traditional একটি বুলিয়ান ভ্যালু নির্দেশ করে যে param serialization এর গতানুগতিক স্টাইল ব্যবহার করবে কি করবে না তা নির্দেশ করে।
type রিকুয়েস্টের টাইপ নির্দেশ করে(GET অথবা POST)
url রিকুয়েস্ট পাঠানোর URL কে নির্দেশ করে। ডিফল্ট হলো কারেন্ট পেজ।
username HTTP এক্সেস অথেন্টিকেশন রিকুয়েস্টে একটি username ব্যবহার করতে হবে তা নির্দেশ করে
xhr XMLHttpRequest অবজেক্ট তৈরির জন্য ব্যবহৃত একটি ফাংশন

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
  $("button").click(function(){
    $("p").detach();
  });
});
</script>
</head>
<body>

<p>এটি একটি প্যারাগ্রাফ।</p>
<p>এটি অন্য একটি প্যারাগ্রাফ।</p>
<button>সকল p এলিমেন্ট রিমুভ করুন</button>

</body>
</html>

ফলাফল




উদাহরণ

একটি অ্যাসিঙ্ক্রোনাস অ্যাজাক্স রিকুয়েস্ট তৈরি

কিভাবে সিঙ্ক্রোনাস রিকুয়েস্ট নির্দেশ করার জন্য async সেটিংস ব্যবহার করতে হয়

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        $.ajax({url: "demo_ajax_load.txt", async: false, success: function(result){
            $("div").html(result);
        }});
    });
});
</script>
</head>
<body>

<div><h2>আজাক্সের মাধ্যমে এই টেক্সটকে পরিবর্তন হতে দেই</h2></div>

<button>কন্টেন্ট পরিবর্তন করি</button>

</body>
</html>

ফলাফল




নির্দিষ্ট ডাটা টাইপ দিয়ে একটি অ্যাজাক্স রিকুয়েস্ট তৈরি

কিভাবে রিকুয়েস্টের জন্য ডাটাটাইপ নির্দেশ করার জন্য dataType সেটিংস ব্যবহার করতে হয়।

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        $.ajax({url: "demo_ajax_script.js", dataType: "script"});
    });
});
</script>
</head>
<body>

<button>একটি জাভাস্ক্রিপ্ট ফাইল পেতে এবং রান করতে অ্যাজাক্স ব্যবহার করি</button>

</body>
</html>

ফলাফল




একটি এঁরর অ্যাজাক্স রিকুয়েস্ট তৈরি কর

কিভাবে রিকুয়েস্টে এঁররের সংগে মোকাবিলা করতে error সেটিংস ব্যবহার করতে হয়।

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জেকুয়েরির উদাহরণ</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script>
$(document).ready(function(){
    $("button").click(function(){
        $.ajax({url: "wrongfile.txt", error: function(xhr){
            alert("একটি এঁরর ঘটেছে: " + xhr.status + " " + xhr.statusText);
        }});
    });
});
</script>
</head>
<body>

<p>আর্টিষ্ট</p>
<div></div>

<button>সিডির বিবরণী দেখি</button>

</body>
</html>

ফলাফল




« জেকুয়েরি অ্যাজাক্স মেথডসমূহ