واحد من الناسـ
22-07-07, 12:17 PM
بسم الله الرحمن الرحيم
الحمد لله رب العالمين
والصلاة السلام على أشرف المرسلين
سيدنا محمد عليه أفضل الصلوات والتسليم
السلام عليكم ورحمة الله وبركاته
سنبدأ اليوم في شرح أدوات الإدخال في النماذج ومحرر النصوص
أتمنى من الله أن يكون سهل وبسيط في نفس الوقت
بسم الله نبدأ :::
أدوات الإدخال في النماذج
كنا قد ذكرنا في الدرس السابق أنه يوجد بعض أدوات الإدخال القياسية مثل صندوق الكتابة **** Box ومفاتيح الإختيار Radio and Check buttons ويمكنك وضعها في الصفحة عن طريق كتابة كود قياسي كما يلي ::
<input type="[نوع أداة التحكم]" name="[إسم الأداة في الكود]"
value="[القيمة التي تعرضها الأداة]">
مما سبق إذا أردت إدراج صندوق نصي في الصفحة فأكتب الكود التالي ::
<input type="****" name="****field"
value="الطايـــــر">
وتكون النتيجة كما بالشكل التالي ::
http://www.eltayer.net/lesson/28.gif
ولرؤية مثال حي
أضغط هنا (http://www.eltayer.net/lesson/new.php)
مثال::
سنقوم الآن بكتابة ملفين ، الأول به كود عادي HTML والآخر به كـود PHP يقوم بإظهار نتيجة مدخلات المستخدم في الصفحة الأولى وفيما يلي خطوات أداء ذلك ::
قم بفتح ملف جديد ( يمكنك إستخدام Notepad أو أي محرر آخر مناسب ) وأكتب في الملف الأول الكود الآتي ::
<html dir ="rtl">
<FORM METHOD="GET" ACTION="result.php">
قم بإدخال عنوانك
<br>
<INPUT TYPE="****" NAME="myaddr" VALUE="عنواني">
</br>
<INPUT TYPE="submit" VALUE="إرسال">
<INPUT TYPE="reset" VALUE="حذف">
</FORM>
</html>
قم الآن بحفظ الصفحة بالإسم page1.htm
قم الآن بإنشاء الصفحة الثانية من المثال وقم بتسميتها result.php وأكتب الكود التالي بداخلها ::
<?
Echo "عنوانك هو: "."".$_GET["myaddr"];
?>
قم الآن بحفظ الملف الثاني بالإسم 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=%C7%E1%CC%ED%D2%C9+-+%E3%D5%D1
في الصفحة الأولى لم نحتاج إلى كتابة لغة PHP لأن لغة HTML القياسية توفر أدوات التحكم في النماذج .
قمنا في الصفحة الأولى بتحديد نموذج Form والصفحة الثانية التي ستتلقى القيم أو المتغيرات من الصفحة الحالية .
قمنا بإدراج ****Box وسميناه بالإسم "myaddr" وهو نفسه إسم المتغير الذي سيتم إرساله إلى الصفحة result.php .
كما ذكرنا يجب أن يكون لكل نموذج مفتاح واحد على الأقل يقوم بعملية submit أو تنفيذ النموذج وهنا قمنا بتعريب المفتاح إلى "إرسال" ، ويمكن أيضاً إدراج مفتاح لألغاء القيمة المدخلة إلى القيمة الإفتراضية كما فعلنا .
بعد الضغط على المفتاح "إرسال" ، هنا يتم إرسال بيانات الصفحة المحددة في الخاصية Action وفي الصفحة result.php تم الوصول إلى المتغير المرسل عن طريق المصفوفة
$_GET[""]
التي تحتوي على جميع المتغيرات المرسلة بالطريقة GET ولايبقى سوى كتابة إسم المتغير بين علامتي التنصيص هكذا ::
$_GET["myaddr"]
ليتم إستعراض قيمته .
محرر النصوص
يمكن إدراج محرر نصي بسيط في الصفحة إذا كان هناك حاجة لإدخال عدة أسطر من النصوص الحرفية ، ويتم ذلك عن طريق الوسم ::
<****area name="" rows=رقم cols=رقم >
</****area>
فيمكن تحديد عدد الصفوف عن طريق الخاصية rows وعدد الأعمدة عن طريق الخاصية cols .
مثال ::
قم بوضع الوسم الآتي ::
<****area name="****area" rows="4" cols="20" >
</****area>
في الصفحة السابقة page1.htm وعدل الوسيلة GET بالوسيلة POST ، ثم عدل في الصفحة result.php بحيث يتم إستعراض سطور المحرر عن طريق إستبدال السطر $_GET حتى يصبح كما يلي
$_POST["****area"];
وأكتب المثال بالكامل مرة أخرى حتى يسهل علينا تنفيذه ::
الصفحة page1.htm سنغير إسمها لتكون page2.htm للتفرقة بينها وبين المثال السابق وسيكون الكود فيها كالتالي ::
<html dir ="rtl">
<FORM METHOD="POST" ACTION="result1.php">
قم بإدخال عنوانك
<br>
<****area name="****area" rows="4" cols="20" >
</****area>
</br>
<INPUT TYPE="submit" VALUE="إرسال">
<INPUT TYPE="reset" VALUE="حذف">
</FORM>
</html>
وستظهر كما في الشكل التالي ::
http://www.eltayer.net/lesson/31.gif
وبالنسبة للصفحة result.php سنغير إسمها لتكون result1.php للتفرقة بينها وبين المثال السابق ونلاحظ أننا عدلنا الإسم في الكود السابق وسيكون الكود فيها كما يلي ::
<?
Echo "عنوانك هو: "."".$_POST["****area"];
?>
وعند الضغط على مفتاح الإرسال ستكون النتيجة كما في الشكل التالي ::
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) .
وأي إستفسار في خدمتكم يالغلا
ولا تنسوني من دعائكم
أخيكم الطاير :icon26:
منقول من الطاير جزاه الله كلـ خير
دُمتم بحفظ الله
الحمد لله رب العالمين
والصلاة السلام على أشرف المرسلين
سيدنا محمد عليه أفضل الصلوات والتسليم
السلام عليكم ورحمة الله وبركاته
سنبدأ اليوم في شرح أدوات الإدخال في النماذج ومحرر النصوص
أتمنى من الله أن يكون سهل وبسيط في نفس الوقت
بسم الله نبدأ :::
أدوات الإدخال في النماذج
كنا قد ذكرنا في الدرس السابق أنه يوجد بعض أدوات الإدخال القياسية مثل صندوق الكتابة **** Box ومفاتيح الإختيار Radio and Check buttons ويمكنك وضعها في الصفحة عن طريق كتابة كود قياسي كما يلي ::
<input type="[نوع أداة التحكم]" name="[إسم الأداة في الكود]"
value="[القيمة التي تعرضها الأداة]">
مما سبق إذا أردت إدراج صندوق نصي في الصفحة فأكتب الكود التالي ::
<input type="****" name="****field"
value="الطايـــــر">
وتكون النتيجة كما بالشكل التالي ::
http://www.eltayer.net/lesson/28.gif
ولرؤية مثال حي
أضغط هنا (http://www.eltayer.net/lesson/new.php)
مثال::
سنقوم الآن بكتابة ملفين ، الأول به كود عادي HTML والآخر به كـود PHP يقوم بإظهار نتيجة مدخلات المستخدم في الصفحة الأولى وفيما يلي خطوات أداء ذلك ::
قم بفتح ملف جديد ( يمكنك إستخدام Notepad أو أي محرر آخر مناسب ) وأكتب في الملف الأول الكود الآتي ::
<html dir ="rtl">
<FORM METHOD="GET" ACTION="result.php">
قم بإدخال عنوانك
<br>
<INPUT TYPE="****" NAME="myaddr" VALUE="عنواني">
</br>
<INPUT TYPE="submit" VALUE="إرسال">
<INPUT TYPE="reset" VALUE="حذف">
</FORM>
</html>
قم الآن بحفظ الصفحة بالإسم page1.htm
قم الآن بإنشاء الصفحة الثانية من المثال وقم بتسميتها result.php وأكتب الكود التالي بداخلها ::
<?
Echo "عنوانك هو: "."".$_GET["myaddr"];
?>
قم الآن بحفظ الملف الثاني بالإسم 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=%C7%E1%CC%ED%D2%C9+-+%E3%D5%D1
في الصفحة الأولى لم نحتاج إلى كتابة لغة PHP لأن لغة HTML القياسية توفر أدوات التحكم في النماذج .
قمنا في الصفحة الأولى بتحديد نموذج Form والصفحة الثانية التي ستتلقى القيم أو المتغيرات من الصفحة الحالية .
قمنا بإدراج ****Box وسميناه بالإسم "myaddr" وهو نفسه إسم المتغير الذي سيتم إرساله إلى الصفحة result.php .
كما ذكرنا يجب أن يكون لكل نموذج مفتاح واحد على الأقل يقوم بعملية submit أو تنفيذ النموذج وهنا قمنا بتعريب المفتاح إلى "إرسال" ، ويمكن أيضاً إدراج مفتاح لألغاء القيمة المدخلة إلى القيمة الإفتراضية كما فعلنا .
بعد الضغط على المفتاح "إرسال" ، هنا يتم إرسال بيانات الصفحة المحددة في الخاصية Action وفي الصفحة result.php تم الوصول إلى المتغير المرسل عن طريق المصفوفة
$_GET[""]
التي تحتوي على جميع المتغيرات المرسلة بالطريقة GET ولايبقى سوى كتابة إسم المتغير بين علامتي التنصيص هكذا ::
$_GET["myaddr"]
ليتم إستعراض قيمته .
محرر النصوص
يمكن إدراج محرر نصي بسيط في الصفحة إذا كان هناك حاجة لإدخال عدة أسطر من النصوص الحرفية ، ويتم ذلك عن طريق الوسم ::
<****area name="" rows=رقم cols=رقم >
</****area>
فيمكن تحديد عدد الصفوف عن طريق الخاصية rows وعدد الأعمدة عن طريق الخاصية cols .
مثال ::
قم بوضع الوسم الآتي ::
<****area name="****area" rows="4" cols="20" >
</****area>
في الصفحة السابقة page1.htm وعدل الوسيلة GET بالوسيلة POST ، ثم عدل في الصفحة result.php بحيث يتم إستعراض سطور المحرر عن طريق إستبدال السطر $_GET حتى يصبح كما يلي
$_POST["****area"];
وأكتب المثال بالكامل مرة أخرى حتى يسهل علينا تنفيذه ::
الصفحة page1.htm سنغير إسمها لتكون page2.htm للتفرقة بينها وبين المثال السابق وسيكون الكود فيها كالتالي ::
<html dir ="rtl">
<FORM METHOD="POST" ACTION="result1.php">
قم بإدخال عنوانك
<br>
<****area name="****area" rows="4" cols="20" >
</****area>
</br>
<INPUT TYPE="submit" VALUE="إرسال">
<INPUT TYPE="reset" VALUE="حذف">
</FORM>
</html>
وستظهر كما في الشكل التالي ::
http://www.eltayer.net/lesson/31.gif
وبالنسبة للصفحة result.php سنغير إسمها لتكون result1.php للتفرقة بينها وبين المثال السابق ونلاحظ أننا عدلنا الإسم في الكود السابق وسيكون الكود فيها كما يلي ::
<?
Echo "عنوانك هو: "."".$_POST["****area"];
?>
وعند الضغط على مفتاح الإرسال ستكون النتيجة كما في الشكل التالي ::
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) .
وأي إستفسار في خدمتكم يالغلا
ولا تنسوني من دعائكم
أخيكم الطاير :icon26:
منقول من الطاير جزاه الله كلـ خير
دُمتم بحفظ الله