المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : [الدرس مفصل الحادي عشر] أدوات الإدخال في النماذج



admin
11-01-2013, بتوقيت غرينيتش 09:05 AM
http://www.dzbatna.com/images/icons/iconrote.gif [ط§ظ„ط¯ط±ط³ ط§ظ„ط*ط§ط¯ظٹ ط¹ط´ط±] ط£ط¯ظˆط§طھ ط§ظ„ط¥ط¯ط®ط§ظ„ ظپظٹ ط§ظ„ظ†ظ…ط§ط°ط¬ (http://www.dzbatna.com/t87809/)



بسم الله الرحمن الرحيم
الحمد لله رب العالمين
والصلاة السلام على أشرف المرسلين
سيدنا محمد عليه أفضل الصلوات والتسليم

السلام عليكم ورحمة الله وبركاته
تحية طيبة لرواد القسم الجميل

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

اقتباس


[الدرس مفصل الأول] مقدمة في لغة Php والتعرف على مميزاتها (http://www.dzbatna.com/t54666/)
[الدرس مفصل الثاني] تركيب install برنامج Iis (http://www.dzbatna.com/t56278/)
[الدرس مفصل الثالث] شرح طريقة كيفية تركيب install مترجم لغة Php (http://www.dzbatna.com/t57409/)
[الدرس مفصل الرابع] كيف تضيف قاعدة البيانات MySQL لسيرفر SERVER IIS (http://www.dzbatna.com/t58657/)
[الدرس مفصل الخامس] تركيب install ملف Php وتنفيذ صفحات Php (http://www.dzbatna.com/t60036/)
[الدرس مفصل السادس] شرح طريقة بروتوكولات تبادل المعلومات بين السيرفر SERVER والمتصفح (http://www.dzbatna.com/t60931/)
[الدرس مفصل السابع] التعليقات والمتغيرات (http://www.dzbatna.com/t62832/)
[الدرس مفصل الثامن] البيانات الحرفية والبيانات العددية (http://www.dzbatna.com/t68694/)
[الدرس مفصل التاسع] شرح طريقة متغيرات النظام والثوابت وبعض الدوال (http://www.dzbatna.com/t70285/)
[الدرس مفصل العاشر] إستخدام النماذج Form (http://www.dzbatna.com/t82487/)




وإن شاء الله سنبدأ اليوم في شرح طريقة أدوات الإدخال في النماذج ومحرر النصوص

أتمنى من الله أن يكون سهل وبسيط في نفس الوقت



بسم الله نبدأ :::


أدوات الإدخال في النماذج


كنا قد ذكرنا في الدرس مفصل السابق أنه يوجد بعض أدوات الإدخال القياسية مثل صندوق الكتابة Text Box ومفاتيح الإختيار Radio and Check buttons ويمكنك وضعها في الصفحة عن طريق كتابة كود code قياسي كما يلي ::




مما سبق إذا أردت إدراج صندوق نصي في الصفحة فأكتب الكود code التالي ::


رمز PHP:

<code style="white-space:nowrap"> <code> <input type="text" name="textfield"
value="الطايـــــر">
</code> </code>



وتكون النتيجة كما بالشكل التالي ::


http://www.eltayer.net/lesson/28.gif

ولرؤية مثال حي

أضغط هنا (http://www.eltayer.net/lesson/new.php)

مثال::

سنقوم الآن بكتابة ملفين ، الأول به كود code عادي HTML والآخر به كـود PHP يقوم بإظهار نتيجة مدخلات المستخدم في الصفحة الأولى وفيما يلي خطوات أداء ذلك ::


قم بفتح ملف جديد ( يمكنك إستخدام Notepad أو أي محرر آخر مناسب ) وأكتب في الملف الأول الكود code الآتي ::


رمز PHP:

<code style="white-space:nowrap"> <code> <html dir ="rtl">
<FORM METHOD="GET" ACTION="result.php">
قم بإدخال عنوانك
<br>
<INPUT TYPE="text" NAME="myaddr" VALUE="عنواني">
</br>
<INPUT TYPE="submit" VALUE="إرسال">
<INPUT TYPE="reset" VALUE="حذف">
</FORM>
</html>
</code> </code>



قم الآن بحفظ الصفحة بالإسم page1.htm
قم الآن بإنشاء الصفحة الثانية من المثال وقم بتسميتها result.php وأكتب الكود code التالي بداخلها ::


رمز PHP:

<code style="white-space:nowrap"> <code> <?
Echo "عنوانك هو: "."".$_GET&#91;"myaddr"&#93;;
?> </code> </code>



قم الآن بحفظ الملف الثاني بالإسم result.php في الدليل


c:\Inetpub\wwwroot

قم بفتح برنامج IE وأكتب العنوان التالي ::


http://localhost/page1.htm

ستظهر أمامك النافذة الأولى
قم بكتابة أي قيمة تريدها كما بالشكل التالي ::


http://www.eltayer.net/lesson/29.gif

بعد الإنتهاء من الإدخال قم بالضغط على المفتاح إرسال ، ويجب أن تكون النتيجة كما بالشكل التالي ::


http://www.eltayer.net/lesson/30.gif




ولتجربة مثال حي


أضغط هنا (http://www.eltayer.net/lesson/page1.htm)

ملاحظات على المثال ::


تم إرسال القيمة المدخلة كجزء من العنوان بالشكل ::


http://localhost/result.php?myaddr=%...C9+-+%E3%D5%D1 (http://localhost/result.php?myaddr=%C7%E1%CC%ED%D2%C9+-+%E3%D5%D1)

في الصفحة الأولى لم نحتاج إلى كتابة لغة PHP لأن لغة HTML القياسية توفر أدوات التحكم في النماذج .
قمنا في الصفحة الأولى بتحديد نموذج Form والصفحة الثانية التي ستتلقى القيم أو المتغيرات من الصفحة الحالية .
قمنا بإدراج TextBox وسميناه بالإسم &quot;myaddr&quot; وهو نفسه إسم المتغير الذي سيتم إرساله إلى الصفحة result.php .
كما ذكرنا يجب أن يكون لكل نموذج مفتاح واحد على الأقل يقوم بعملية submit أو تنفيذ النموذج وهنا قمنا بتعريب المفتاح إلى &quot;إرسال&quot; ، ويمكن أيضاً إدراج مفتاح لألغاء القيمة المدخلة إلى القيمة الإفتراضية كما فعلنا .
بعد الضغط على المفتاح &quot;إرسال&quot; ، هنا يتم إرسال بيانات الصفحة المحددة في الخاصية Action وفي الصفحة result.php تم الوصول إلى المتغير المرسل عن طريق المصفوفة
$_GET[&quot;&quot;]
التي تحتوي على جميع المتغيرات المرسلة بالطريقة GET ولايبقى سوى كتابة إسم المتغير بين علامتي التنصيص هكذا ::
$_GET[&quot;myaddr&quot;]
ليتم إستعراض قيمته .




محرر النصوص


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


رمز PHP:

<code style="white-space:nowrap"> <code> <textarea name="" rows=رقم cols=رقم >
</textarea>
</code> </code>



فيمكن تحديد عدد الصفوف عن طريق الخاصية rows وعدد الأعمدة عن طريق الخاصية cols .

مثال ::

قم بوضع الوسم الآتي ::


رمز PHP:

<code style="white-space:nowrap"> <code> <textarea name="textarea" rows="4" cols="20" >
</textarea>
</code> </code>



في الصفحة السابقة page1.htm وعدل الوسيلة GET بالوسيلة POST ، ثم عدل في الصفحة result.php بحيث يتم إستعراض سطور المحرر عن طريق إستبدال السطر $_GET حتى يصبح كما يلي


رمز PHP:

<code style="white-space:nowrap"> <code> $_POST&#91;"textarea"&#93;;
</code> </code>



وأكتب المثال بالكامل مرة أخرى حتى يسهل علينا تنفيذه ::

الصفحة page1.htm سنغير إسمها لتكون page2.htm للتفرقة بينها وبين المثال السابق وسيكون الكود code فيها كالتالي ::


رمز PHP:

<code style="white-space:nowrap"> <code> <html dir ="rtl">
<FORM METHOD="POST" ACTION="result1.php">
قم بإدخال عنوانك
<br>
<textarea name="textarea" rows="4" cols="20" >
</textarea>
</br>
<INPUT TYPE="submit" VALUE="إرسال">
<INPUT TYPE="reset" VALUE="حذف">
</FORM>
</html>
</code> </code>



وستظهر كما في الشكل التالي ::


http://www.eltayer.net/lesson/31.gif


وبالنسبة للصفحة result.php سنغير إسمها لتكون result1.php للتفرقة بينها وبين المثال السابق ونلاحظ أننا عدلنا الإسم في الكود code السابق وسيكون الكود code فيها كما يلي ::


رمز PHP:

<code style="white-space:nowrap"> <code> <?
Echo "عنوانك هو: "."".$_POST&#91;"textarea"&#93;;
?> </code> </code>



وعند الضغط على مفتاح الإرسال ستكون النتيجة كما في الشكل التالي ::


http://www.eltayer.net/lesson/32.gif

ولتجربة مثال حي

أضغط هنا (http://www.eltayer.net/lesson/page2.htm)

ملاحظة ::

الطريقة POST لايظهر في سطر العنوان قيم المتغيرات فيظهر كما يلي ::





http://localhost/result.php

ويتضح من المثالين الإختلاف بين الطريقة GET والطريقة POST .



أسأل الله أن لا أكون أطلت عليكم الحديث وأن يكون الدرس مفصل سهل وواضح

وإن شاء الله في الدرس مفصل القادم سوف نتطرق إلى شرح طريقة مربعات الإختيار المتعدد (Check Box) و أدوات الإختيار المنفردة (Radio Buttons) .

وأي إستفسار في خدمتكم يالغلا

ولا تنسوني من دعائكم

أخيكم الطاير http://www.dzbatna.com/images/smilies/icon26.gif






ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)




https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى