পিএইচপি এসকিউএল ওয়ার্ডপ্রেস জাভাস্ক্রিপ্ট জেকুয়েরি এইচটিএমএল
ফোরাম
×

পিএইচপি টিউটোরিয়াল

হোম-HOME পরিচিতি-Introduction ইনস্টল-Install গঠনপ্রনালী-Syntax চলক-Variable পিএইচপি Echo / Print তথ্যের ধরণ-Data Types কনস্ট্যান্ট-Constant অপারেটর-Operator ফাংশন-Function সুপারগ্লোভাল-Superglobal

কন্ট্রোল স্টেটমেন্ট

if স্টেটমেন্ট if...Else স্টেটমেন্ট Switch স্টেটমেন্ট While লুপ DO...While লুপ For লুপ

পিএইচপি এ্যারে এবং স্ট্রিং

এ্যারে-Array এ্যারে সর্টিং -Array Sorting মাল্টি এ্যারে-Multi Array স্ট্রিং-String

পিএইচপি এডভান্স

তারিখ এবং সময় পিএইচপি include ফাইল হ্যান্ডলিং-File Handling ফাইল খোলা/পড়া ফাইল তৈরি/লিখা ফাইল আপলোড ফাইল ডাউনলোড কুকি-Cookie সেশন-Session ফিল্টার-Filter এডভান্স ফিল্টার-Advance Filter এঁরর হ্যান্ডলিং-Error Handling এক্সেপশন হ্যান্ডেলিং-Exception Handling

পিএইচপি ফরম

ফরম হ্যান্ডলিং ফরম ভ্যালিডেশন আবশ্যক ফরম ফিল্ড ফরম URL/E-mail সম্পূর্ণ ফরম

MySQL ডেটাবেজ

MySQL ডেটাবেজ MySQL ডেটাবেজ সংযোগ MySQL ডেটাবেজ তৈরী MySQL টেবিল তৈরী MySQL তথ্য ইনসার্ট MySQL শেষ আইডি পান MySQL একাধিক তথ্য ইনসার্ট MySQL প্রিপেয়ার্ড স্টেটমেন্ট MySQL তথ্য সিলেক্ট MySQL তথ্য ডিলিট MySQL তথ্য আপডেট MySQL সীমিত তথ্য সিলেক্ট

পিএইচপি- এক্সএমএল

PHP XML Parser PHP SimpleXML Parser PHP XML Parser PHP SimpleXML - Get PHP XML Expat PHP XML Dom

পিএইচপি - এজাক্স

পিএইচপি AJAX পরিচিতি AJAX পিএইচপি AJAX ডেটাবেজ AJAX এক্সএমএল AJAX সারাসরি সার্চ AJAX RSS রির্ডার AJAX Poll

পিএইচপি অবজেক্ট অরিয়েন্টেড প্রোগ্রামিং(OOP)

OOP পরিচিতি OOP class তৈরী OOP objects তৈরী OOP $this কিওয়ার্ড OOP মেথড এবং প্রোপার্টি চেইনিং OOP অ্যাক্সেস মোডিফায়ার OOP ম্যাজিক মেথড এবং কন্সটেন্ট OOP ইনহেরিটেন্স OOP Abstract class এবং method OOP ইন্টারফেস OOP পলিমরফিজম OOP টাইপ হিন্টিং() OOP টাইপ হিন্টিনং ইন্টারফেস OOP স্ট্যাটিক মেথোড এবং প্রোপার্টি

 

পিএইচপিতে AJAX এবং XML এর ব্যবহার


XML এর সাথে ইন্টারেক্টিভ(interactive) এবং ডাইনামিক যোগাযোগ তৈরি করার জন্য আমরা AJAX ব্যবহার করি। আপনি AJAX ব্যবহার করে XML থেকে সম্পূর্ণ তথ্য কুয়েরি না করে, বরং আপনি ক্ষুদ্র ক্ষুদ্র তথ্য কুয়েরি করতে পারেন।


AJAX এবং XML এর উদাহরণ

আমাদের এই উদাহরণে দেখবো, AJAX ব্যবহার করে কিভাবে আমরা XML থেকে সম্পূর্ণ তথ্য অ্যাক্সেস না করে ক্ষুদ্র ক্ষুদ্র তথ্য অ্যাক্সেস করতে পারি। উদাহরণের ব্যাখ্যার জন্য আমরা সম্পূর্ণ কোড তিনভাগে ভাগ করেছিঃ এইচটিএমএল কোড, AJAX কোড এবং পিএইচপি কোড।

উদাহরণ: এইচটিএমএল কোড
<!DOCTYPE html>
<html>
<head>
 <title>পিএইচপি AJAX এবং XML এর উদাহরণ</title>
</head>
<body>

<form>
    একটি বই সিলেক্ট করুনঃ
    <select name="books" onchange="showBookDetails(this.value)">
        <option value="">বই সিলেক্ট করুনঃ</option>
        <option value="বিষাদ সিন্ধু">বিষাদ সিন্ধু</option>
        <option value="উজান">উজান</option>
        <option value="মেঘ বৃষ্টি আলো">মেঘ বৃষ্টি আলো</option>
        <option value="ভালোবেসে তোমাকে">ভালোবেসে তোমাকে</option>
        <option value="আনন্দ সহচরী">আনন্দ সহচরী</option>
        <option value="ইতি...">ইতি...</option>
    </select>
</form>
<div id="bookdetails">বইয়ের সারাংশ এখানে আসবে...</div>

</body>
</html>

উপরের উদাহরণে ইউজার যখন ড্রপডাইন তালিকা থেকে একটি বইয়ের নাম সিলেক্ট করবে, তখন showBookDetails() ফাংশনটি সম্পাদিত হবে এবং উক্ত বইয়ের বিস্তারিত তথ্য প্রদর্শিত হবে। onchange ইভেন্ট এর মাধ্যমে এই ফাংশনটি সম্পাদিত হয়।

উদাহরণঃ এইচটিএমএল এর সাথে ব্যবহৃত AJAX কোড
<script>
    //এই ফাংশনের মধ্য দিয়ে ড্রপ-ডাউন লিস্ট থেকে স্ট্রিং/বইয়ের নাম অতিক্রম করানো হয়।
    function showBookDetails(string) {
         //কোন বইয়ের নাম অতিক্রম করানো না হলে প্রোগ্রামের কন্ট্রোল ফাংশন থেকে বের হয়ে যায়।
        if (string == "") {
            document.getElementById("bookdetails").innerHTML="";
            return;
        }
        //বইয়ের নাম অতিক্রম করানো হলে request নামে একটি অবজেক্ট তৈরি হয়।
        if (window.XMLHttpRequest) {
            request = new XMLHttpRequest();
        } else {
              // Microsoft(internet explore) এর জন্য request অবজেক্ট তৈরি
              request = new ActiveXObject("Microsoft.XMLHTTP");
        }
        //সার্ভার কার্য সম্পাদনের জন্য প্রস্তুত হলে এই অবজেক্টটি একটি এনোনিমাস ফাংশন তৈরি করে।
        request.onreadystatechange = function() {
                if (request.readyState == 4 && request.status==200) {
                    // উপরের শর্ত true হলে নির্বাচিত বইয়ের তথ্য দিয়ে bookDetails আইডি বিশিষ্ট div এলিমেন্টটি পূরন হয়।
                    document.getElementById("bookdetails").innerHTML = request.responseText;
                 }
        }
        // সার্ভারে অবস্থিত "booksummary.php" ফাইলে p স্ট্রিং(বই) এর তথ্যের জন্য অনুরোধ পাঠায়। 
        request.open("GET","booksummary.php?p=" +string, true);
        request.send();
    }
</script>

কোডের ব্যাখ্যাঃ

প্রথমেই আমরা চেক করে নিব ইউজার কোনো বইয়ের নাম সিলেক্ট করেছে কিনা। যদি না করে থাকে তাহলে ফাংশনটি সম্পাদিত হবে না।

অপরদিকে ইউজার যদি কোনো বইয়ের নাম সিলেক্ট করে থাকে তাহলে নিম্নের ঘটনা সমুহ ঘটবেঃ

  • একটি XMLHttpRequest অবজেক্ট তৈরি হবে।
  • কার্যসম্পাদনের জন্য সার্ভার প্রস্তুত হলে এটি একটি ফাংশন তৈরি করবে।
  • সার্ভারে অবস্থিত "booksummary.php" ফাইলে তথ্যের জন্য অনুরোধ পাঠায়।
  • লক্ষ্য করুন আমরা "booksummary.php" ফাইলের সাথে একটি প্যারামিটার p যুক্ত করেছি যা সার্ভারে একটি string ভ্যারিয়েবল পাঠায়।
  • string ভ্যারিয়েবলটি ইনপুট বক্সের কন্টেন্ট ধারন করে।

পিএইচপি ফাইল

উপরের জাভাস্ক্রিপ্ট কোড এর মাধ্যমে এই পিএইচপি ফাইল(booksummary.php) এর সাথে যোগাযোগ সৃষ্টি করা হয়।

পিএইচপি ফাইলটি XML ফাইল(books.xml) কে লোড করবে এবং XML ফাইল থেকে কাংখিত তথ্য কুয়েরি করবে। পরিশেষে প্রাপ্ত ফলাফল এইচটিএমএল ফর্ম্যাটে ব্রাউজারে প্রদর্শিত হবেঃ

উদাহরণঃ booksummary.php ফাইল
<?php
// AJAX কর্তৃক পাঠানো বইয়ের নাম গ্রহণ করবে।
$p = $_GET["p"];

// xmlDocument নামে একটি ডোম অবজেক্ট তৈরি হবে।
$xmlDocument = new DOMDocument();

//XML ফাইল লোড হবে।
$xmlDocument->load("books.xml");

$summary = $xmlDocument->getElementsByTagName('summary');

for ($i=0; $i<=$summary->length-1; $i++) {
  if ($summary->item($i)->nodeType==1) {
   if ($summary->item($i)->childNodes->item(0)->nodeValue == $p) {
     $list = ($summary->item($i)->parentNode);
    }
  }
}

$book = ($list->childNodes);

for ($i=0;$i<$book->length;$i++) {
  if ($book->item($i)->nodeType==1) {
   echo("<b>" . $book->item($i)->nodeName . ":</b> ");
   echo($book->item($i)->childNodes->item(0)->nodeValue);
   echo("<br>");
  }
}
?>

কোডের ব্যাখ্যা

জাভাস্ক্রিপ্ট(AJAX) থেকে কুয়েরিটি যখন পিএইচপি ফাইলে পাঠানো হয় তখন নিম্নের ঘটনাসমুহ ঘটেঃ

  • AJAX কর্তৃক পাঠানো বইয়ের নাম গ্রহন করবে।
  • একটি XML ডোম(DOM) অবজেক্ট তৈরি করে
  • সকল <title> এলিমেন্ট এর মধ্য থেকে AJAX কর্তৃক পাঠানো বইয়ের তথ্য খুজে বের করে।
  • বইয়ের তথ্য এইচটিএমএল আকারে ব্রাউজারে ফেরত পাঠায়

আমাদের উদাহরণে ব্যবহৃত books.xml ফাইলটি দেখুন।

আপনি উপরের উদাহরণের এইচটিএমএল এবং জাভাস্ক্রিপ্ট কোড গুলোর সমন্বয়ে একটি ফাইল এবং পিএইচপি কোডগুলোর জন্য একটি ফাইল তৈর করে Ajax সম্বলিত এইচটিএমএল ফাইলটি রান করালে বাউজারে নিম্নের ন্যায় ফলাফল দেখবেন।

AJAX এর প্রয়োগ দেখার জন্য ড্রপ ডাউন লিস্ট থেকে যেকোনো একটি বই এর নাম সিলেক্ট করুনঃ

ফলাফল
একটি বই সিলেক্ট করুনঃ

বইয়ের সারাংশ এখানে আসবে...