درس: استخدام الAJAX مع الPHP (بطلب Pal-Heart)

[download]

نعم .. الXML مطلوب في هذة الحالة ..
الXML سيعطيك فرصة لفصل المعلومات عن بعضها .... انا اردت ان اوضح ذالك في الدرس الثاني .. بس مقدة بسيطة مش رايح يظر شيء صح؟

ملفات الXML هو ملفات HTML ولكن يرتكز على تعريف المعلومات التي تحملها .. الHTML فقط تركز على تنسيق المحتوى .. الفرق ان الXML يستطيع ان يشرح و يعطي المعلومات اضافية للمحتوى .. هذا هو الشيء اللذي يجعل الXML تناسب احتياجات الAJAX المعقدة قليلا ..

المفتاح هو في تغير الامر responseText الى responseXML الموجود في ملف الJavaScript
الاختلاف ان الresponseText يعطيك الناتج كنص .. وال responseXML يعطيك الناتج ككائن "Object" اي انك تستطيع التعامل معة مثل ما تتعامل مع المصفوفات في الPHP

ملاحظة
للتعامل مع الXML بسهولة ... تاكد ان ملفك الXML خالي من الاخطاء

فهمت الان وبانتظار الدرس الثاني على احر من الجمر
بارك الله في وقتك وجهدك يا بطل بصراحة درس ولا كل الدروس

[hunter_rare]

ممتاز اخى بارك الله فيك

[T7T GAMES]

جزاك الله الف خير على هالدرس الرائع والمطلوب بشدة
بوركت

بما اني لا افقه شيئ بالبرمجة
وقرأة بالايام السابقة عن تقنية اجاكس وكان لدي تسائل عن مضار تقنية اجاكس

طبعاً اجاكس بشكل عام هي مفيدة جداً للمواقع الكبيرة والتقليل من اللود والضغط على القواعد

طيب نأتي الا المشاكل
لو فرضنا ان تقنية اجاكس مطبقة على محرك البحث في المنتدى هنا

عند البحث لن يتغير الرابط بالاعلى وهنا يسبب مشكلة لو وددت ان تنسخ الرابط لموضوع ما او لصديق

وايضاً لن يكون هناك back الرجوع للخلف

تقريباً هذي مشكلة الاجاكس الوحيدة

السؤال : هل يوجد حل للمشكلة هذي ؟
ومع اطيب واجمل التحايا لك ولمجهودك الطيب ولموضوعك الرائع :nice:

[hilaby]

"دليل عز"
انت شكلك كذّاب! الظاهر انك فاهم في البرمجة ولا تكذب علي! لانك تطرقت على موضوع حساس في الAJAX

نعم للاجاكس مشاكل ...
اولا مثل ما قلت المشكلة في الرابط .. لانه لن يغير شيء في شريط العنوان .. ولكن حلها سهل ... اذا ذهبت الى الموقع www.live.com لميكروسوفت ستجد انهم حلوا المشكلة بطريقة سهلة جداً .. وهي عدم وضع الامر ;return false في الرابط وذالك لكي يظهر تغير بسيط في شريط العنوان .. بوضع علامة ال# ثم علامة الاستفهام ? ثم المتغيرات .. مثال

بعد الكبس على زر او رابط معين .. وذالك للبحث عن شيء ربما البحث مثلا على الكلمة AJAX سيكون شريط العنوان كالتالي
www.mysite.com#?Search=AJAX
وبالمناسبة الJavaScript يمكنة ان يقرء شريط العنوان .. فمن ذالك الفكرة ممكن عمل التالي
اخذ شريط العنوان كنص Text ثم بحذف العلامة # و ارسال الناتج الى السرفر ... الطريقة سهلة صح؟

النقطة الثانية اللذي هي ان الزر الBACK لا يعمل ...
حلها شوي معقد .. لان المتصفحات لا تتعامل مع الزر الBACK بنفس الطريقة الذي يستخدمة متصفح اخر ....
و حلها في الاكبلورار 6 بطريقة الFRAMES و حلها في معضم المتصفحات الاخرى بوجود صفحة ثانية تحفظ مكان الBACK ولكن اكثر الحلول شيوعاً وهي ان الJavaScrip يقراء شريط العنوان لاكثر من 10 مرات في الثانية .. اي نعم انها سيائكل كثيراً من قوة المعالج ولكن هناك حلول كثيرة .. ولكن كل حل له عيوبة .. وانت تستخدم ما يناسب موقعك ..

والسلام عليكم .. وشكراً اخي للتطرق في هذا الموضوع ..

[Mr.php-ar]

جميل جدا اخي ، بارك الله فيك ..

طيب لدي سؤال وربما تتطور لأكثر من سؤال

كيف نتعامل مع form و ajax ؟؟ كيف ارسل القيم بالـ POST أو GET .. لاكثر من حقل ...

كيف يمكن ان اتحكم بالتغذية الراجعه ( المستعلم عنها في ملف php ) .. اذا كانت اكثر

وصراحة نقطة الاخ دليل عز ممتازة جدا وماشاء الله عليك كنت متجهز

ياليت لو تضح لنا الامر بالمثال وكذلك الردود على مشاركتي

بارك الله فيك وماقصرت

[hilaby]

جريح:
والله شكلك .. مستعجل على الدرس الثاني ...
طيب ...

خليني اكمل الدرس اذاً
تتذكر لما قلت في الدرس "لا تقلق من شئن الnull الان ... هذا في الجزء الثاني من الدرس"

.. من هناك ترسل المعلومات ... اي ان المفتاح هو في تغذية الدالة بمتغيرات المطلوبة
فبدلا من ان تضع الامر "null" اي فراغ ... تضع المتغيرات هناك ... مثال
('Answer.send('topic=AJAX&Post=22
فبذالك الدالة انت قد ارسلت المتغيرات للملف المطلوب "في الدرس كانت الملف Ajax.php"

ولكن المشكلة .. كيف يتم ذالك !!!!
تتذكر اني قلت شيء عن الAjavaScript يريد ان يعرف اين هي المعلومات؟ اي يريد ان يعرف مكان وجود النص المطلوب نقلة او استبدالة ... والحل بواسطة الID ....

فتخيل ان لديك مكان لوضع النص وهي
<"input type="text" value="" id="username>

لاحظ اني وضعت ID خاص بة وهي username .. وذالك سيسهل عملية التحديد للJavaScript ... ولفعل ذالك يتم العملية بواسطة الكود التالي .. "كود يظاف الى كود الJavaScript"


var username = document.getElementById('username').value

لاحظ استخدامي للامر نفسة getElementByID ومعناها "اعطيني الحاوية التي تمتلك الID الفلاني" .. ومن ثم حفظة في متغير في الJavaScript اسمة username لكي يستخدم في الارسال

وشكراً

[Mr.php-ar]

بارك الله فيك اخي جميل جداً .. مااشاء الله عليك ..

طيب سؤال يتعلق بماكتبت .. انت ذكرت هنا

('Answer.send('topic=AJAX&Post=22

بدل null ... لكن كيف اوصل له القيم ؟؟!!

يعني ربما الـ Post تكون متغيره اليس كذلك ...

طلب : ياليت تعمل مثال كما عملته باول المشاركة وجزاك الله الف خير

[hilaby]

معليش اعتذر هذة المرة .. الحين الساعة 3:30 صباحاً .. انشاء الله ارد عليك في وقت الغذاء بكرة .... وانشاء الله سيكون السكربت جاهز للتحميل

[Mr.php-ar]

باذن الله ، وبارك الله فيك اخوي hilaby .. الحين وانا اكتب الرد 11:49 طبعا مساء ..

بانتظارك ، وبارك الله فيك وبجهودك

[اسامة الهادى]

hilaby
ماشاء الله عليك
والله قليلا ما اركز فى درس واتبعه كدا
إلى الأمام يابطل
وانا منتظر الرد على الأخ نايف فى نقاطه اللى طرحها لإنى ايضا محتاجها

( أسجل إعجابى بطريقه شرحك )

[xremas]

مشكووور جدا

وفقك الله

[أحمد أبو النصر]

أخوي جريح ، إذا كنت انا فاهم عليك .. بحب أوضح لك النقطة اللي سألت عنها ،

كيف توصل القيم المتغيرة ؟!!

لدينا هذا الكود :

Answer.send('topic=AJAX&Post=22') 

لنفترض أن لديك مربع نص InputBox وكان الـID الخاص به هو UserName

نقوم بعمل التالي:

Answer.send('topic=AJAX&Post=' + document.getElementById('UserName').value) 

أرجو انه يكون هذا مرادك .. وإن أخطأت في فهمك أرجو أن تعذرني

وشكراً للأخ hilaby على الموضوع الرائع جداً والشيق وأتمنى له الاستمرار في مثل هذه الدروس القوية

[Snake PHP]

جميل اخوي sBForum بارك الله فيك اعتقد انها بتنفع وهو نفس طلبي .. بجربها

بارك الله فيك ماقصرت

[hilaby]

"جريح"
معليش تاخرت عليك شوي ... المهم .. الملف المرفق مع هذا الرد .. يحوي على تغيرات الجديدة ..
التغيرات هي:
1- يوجد حقلين ... وهما username و password
2- الرد من ملف الAjax.php هو ملف XML .. لاحظ وجود التعريف <?xml version='1.0' standalone='yes'?>
لان الJavaScipt في بعض الاحيان لا يحب ملفات XML غير معرفة ..
3- ملف JavsScipt معدل لكي يستطيع التعامل مع اكثر من حقل ..

الشرح:
الملفات Ajax.php و index.html ليست معدلة بذالك التعديلات الهامة .. فابدء فوراً بشرح الJavaScript.js

اولاً لنرى الناتج من ارسال بيانات للملف Ajax.php .. على الاقل هذا سيعطينا نظرة شاملة على الشيطان XML

<?xml version='1.0' standalone='yes'?>
	<answer>
		<username>admin</username>
		<password>tiger</password>
	</answer>

والان ... السطر 12: ;document.getElementById('username').value
هذا السطر يعمل بشيء واحد .. وهو جلب المعلومة الموجودة في الحاوي "حقل" username و السطر 13 يفعل نفس الشيء للpassword

والاهم هو كيفية القرائة من الناتج .. اي كيف ناخذ المتغيرات من ملف الXML
والحل تجدة في السطر 25: وهي

document.getElementById('usernameFromPHP').innerHTML = Answer.responseXML.getElementsByTagName("answer")[0].childNodes[0].childNodes[0].data;

[T7T GAMES]

hilaby تم تسميتك استاذ اجاكس :nice: لردودك المميزة على التساؤلات

وبخصوص اني كذاب اتمنى ذلك في هذي النقطة ولكن للأسف لا افهم شيئ بالبرمجة

ولكن كان السؤال ليستفيد غيري من هذا السؤال والحمدالله انت جاوبت وجزاك الله خير

وبارك الله فيك وبعملك
وبالتوفيق ..