Chakira
11-01-2013, بتوقيت غرينيتش 01:58 PM
http://www.dzbatna.com/images/icons/iconrote.gif ط´ط±ط* input ظˆظƒظ„ ظ…طھط¹ظ„ظ‚ط§طھظ‡ط§ ط¨ط§ظ„طھظپطµظٹظ„ ظ…ط¹ ط§ظ„طµظ€ظˆط± (http://www.dzbatna.com/t936327/)
السلام عليكم ورحمة الله وبركاتهـ,,
الدرس مفصل عن مربع الادخـال ( input ) وكلـ. مـا يتعلـق بهـ.. ^_^
اليـوم سنتحدث عـن نـوع حقـل الادخـآل (TYBE)
والأنواعـ الخاصهـ بالحقل TYBE هيـ التاليهـ...
TEXT | CHECKBOX | RADIO | PASSWORD | HIDDEN | SUBMIT | RESET | BUTTON | FILE | IMAGE
وسنقـوم الآن بعمـل شرح طريقةـ لعمـل كـل منـها
http://up3.m5zn.com/get-8-2014-r7g403ahlxb.jpg
TYPE هي التي تحدد نوع الإدخـال
NAME هو أسـم الحقـل
نبدأ بـTEXT
عند تحديد نوع مربع الادخال TEXT سوف يصبح صندوق لادخال النص
مثال :
http://up3.m5zn.com/get-8-2014-xr5y0qqxjrj.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT TYPE=TEXT NAME="realname">الاسم<br>
<INPUT TYPE=TEXT NAME="age">العمر<br>
<INPUT TYPE=TEXT NAME="email">البريد الالكتروني<p>
<INPUT TYPE=SUBMIT VALUE="submit">
</FORM>
</code> </code>
CHECKBOX
عند تحديد نوع مربع الادخال CHECKBOX سوف يصبح مربع للاختيار
مثال :
http://up3.m5zn.com/get-8-2014-ms0swe4mwus.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT TYPE=CHECKBOX NAME="maillist">اضافة الى القائمة البريدية!<br>
<INPUT TYPE=CHECKBOX NAME="homepage">اجعل الموقع صفحة البداية!<br>
<INPUT TYPE=CHECKBOX NAME="fav">اضف الموقع للمفضلة!<p>
<INPUT TYPE=SUBMIT VALUE="submit">
</FORM>
</code> </code>
RADIO
عند اختيار نوع مربع الادخال RADIO سوف يصبح مربع للاختيار , لكن ما الفرق بينها وبين CHECKBOX
الخيار RADIO يسمح لك باختيار واحد فقط اما CHECKBOX يسمح لك باختيار اكثر من خيار
مثال :
http://up3.m5zn.com/get-8-2014-dx3f9j27vzx.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
كم طولكـ؟<P>
<INPUT TYPE=RADIO NAME="tall" VALUE="S">قصيـر<BR>
<INPUT TYPE=RADIO NAME="tall" VALUE="M">متوسـط<BR>
<INPUT TYPE=RADIO NAME="tall" VALUE="L">طويـل<P>
<INPUT TYPE=SUBMIT VALUE="submit">
</FORM>
</code> </code>
PASSWORD
عند اختيار الحقل PASSWORD سوف يتم ادراج الاحرف بداخل الحقل على شكل نجوم او نقط مخفيه
مثال :
http://up3.m5zn.com/get-8-2014-1x7qo50gow9.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl" METHOD=POST>
<INPUT TYPE=TEXT NAME="realname">الاسم<BR>
<INPUT TYPE=PASSWORD NAME="mypassword">كلمة المرور<P>
<INPUT TYPE=SUBMIT VALUE="submit">
</FORM>
</code> </code>
HIDDEN
عنـد إختيـار نـوع الحقـل HIDDEN سـوف يتـم ادراج الحقل مخفـي
يتمـ وضعـ فـيه معلومـات لنـ تظهـر بالصفحـة, تستخدم لحفظ معلومات برمجية عند ارسال الفورم لصفحة معينة يتم ارسال قيمتها من الصفحة المرسلة الى الصفحة المرسل اليها
مثال:
مربعـ تسجيل الدخولـ login او نموذج التسجـيل register وصفحهـ اتصلـ بنـا وغيرهـا الكثيـر
http://up3.m5zn.com/get-8-2014-l01g6xpavso.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <H2 align="right">ضع تعلـيق على الموضـوع</H2>
<FORM dir="rtl"METHOD=POST ACTION="../cgi-bin/mycgi.pl">
<INPUT TYPE=HIDDEN NAME="postingID" value="98765">
الاسم:<INPUT NAME="realname" SIZE=30> <BR>
بريدك:<INPUT NAME="email" SIZE=30><BR>
الموضوع:<INPUT NAME="subject" VALUE="رد: مربع الادخال وكل ما يتعلق به" SIZE=30><P>
التعليق:<BR>
<TEXTAREA NAME="comments" COLS=50 ROWS=10 WRAP=VIRTUAL>
</TEXTAREA>
<P><INPUT TYPE=SUBMIT VALUE="أرسـل!">
</FORM>
</code> </code>
لاحـظ اننا وضعنـا حقـل مخفي يحتوي على رقمـ البوستـ
SUBMIT
يستخدم هذا النـوع لعمـل زر يقوم بارسـال الفورمـ
مثـآل :
http://up3.m5zn.com/get-8-2014-xghej54dfv1.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT NAME="realname">: الأسم<BR>
<INPUT NAME="email">: البريـد<P>
<INPUT TYPE=SUBMIT VALUE="ارسال">
</FORM>
</code> </code>
RESET
يستخدم لعمـل زر لاعادة الحقـول الى الوضع الاصلي
مثـال :
http://up3.m5zn.com/get-8-2014-amextuhp84z.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT TYPE=TEXT><p>
<INPUT TYPE=SUBMIT>
<INPUT TYPE=RESET>
</FORM>
</code> </code>
BUTTON
يستخدم لتحديد النوع زر عند الضغط عليه يقوم بتنفيذ امر ما
مثل زر ارفاق ملف في المشاركة وغيرها الكثير
مثـال :
http://up3.m5zn.com/get-8-2014-9j660f234yi.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT NAME="realname" SIZE=30>الاسم :<p>
<INPUT TYPE=BUTTON OnClick="alert(this.form.realname.value);" VALUE="زر يقوم بتنفيذ امر">
</FORM>
</code> </code>
FILE
يستخدمـ لعمـل حقل وزر لاستعراض الملفاتـ من الجهاز
مثل مركز التحميل
مثـال :
http://up3.m5zn.com/get-8-2014-lc3pgg6bhgy.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM METHOD=POST ENCTYPE="multipart/form-data" ACTION="../cgi-bin/mycgi.pl">
<INPUT TYPE=FILE NAME="upfile"><p>
<INPUT TYPE=SUBMIT VALUE="رفـع الملـف">
</FORM>
</code> </code>
IMAGE
يستخدم لوضـع صورهـ بوظيفهـ زر
مثـال :
http://up3.m5zn.com/get-8-2014-0jins5vkt7q.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT NAME="realname"> : الإسم
<INPUT
TYPE=IMAGE
SRC="http://image.kooora.com/i.aspx?i=competitions%2ffifa.jpg"
HEIGHT=110 WIDTH=160
ALT="صورة بوظيفة زر" ALIGN=ABSMIDDLE
>
</FORM>
</code> </code>
الآن نـاتي لشرح طريقةـ العنـاصر :
TYPE : نـوع الحقـل
TEXT | CHECKBOX | RADIO | PASSWORD | HIDDEN | SUBMIT | RESET | BUTTON | FILE | IMAGE
NAME : إسمـ الحقـل
أي اسم تريـده شرط الا يبتدء برقم او رمـز
VALUE : قيمة الحقـل
SIZE : حجـم الحقـل
MAXLENGTH : اقصى عدد للحروف
فلا يسمحـ بادخال حروف اكثر من العدد المسموح به في الحقـل
CHECKED : جعـل مربـع الاختيار radio او CHECKBOX مفعـل
BORDER : حجم حدود الحقـل او الصورة
SRC : رابط الصورة
ALT : نص يظهر عند وقوف الماوس على الصورهـ
WIDTH : عرض العنصر او الصورة بالبكسل او المئوي
HEIGHT : ارتفاع العنصر او الصورة بالبكسل او المئوي
ALIGN : وضع العنصر او الصورة باتجاه معين يمين او يسار او منتصف
RIGHT | LEFT | CENTER
READONLY : جعل مربع ادخال النص غيـر قابـل للتعديل
DISABLED : جعـل العنصـر غيـر فعـال ولا يمكـن تغيير قيمتهـ
onClick : تنفيذ امر عند الضغط على العنصر
onChange : تنفيذ امر عند تغيير قيمه العنصر
onFocus : تنفيذ امر عندما يصبحـ العنصـر فعـال
onBlur : تنفيذ امـر عندمـا يصبحـ العنصر غير فعـال
onKeyPress : تنفيذ أمـر عند ضغط أحد الازرار على العنصـر
onKeyUp : تنفيذ أمـر عند رفـع اليد عن زر الكيبورد
onKeyDown : تنفيذ امـرر عند ضغط على زر الكيبورد
AUTOCOMPLETE : عنـد الضغط على الحقـل تظهـر الكلمـات التي قمـت بكتابتهـا سابقـا في الحقل
ألعاب الأندرويد مجانا و حصريا (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)©
السلام عليكم ورحمة الله وبركاتهـ,,
الدرس مفصل عن مربع الادخـال ( input ) وكلـ. مـا يتعلـق بهـ.. ^_^
اليـوم سنتحدث عـن نـوع حقـل الادخـآل (TYBE)
والأنواعـ الخاصهـ بالحقل TYBE هيـ التاليهـ...
TEXT | CHECKBOX | RADIO | PASSWORD | HIDDEN | SUBMIT | RESET | BUTTON | FILE | IMAGE
وسنقـوم الآن بعمـل شرح طريقةـ لعمـل كـل منـها
http://up3.m5zn.com/get-8-2014-r7g403ahlxb.jpg
TYPE هي التي تحدد نوع الإدخـال
NAME هو أسـم الحقـل
نبدأ بـTEXT
عند تحديد نوع مربع الادخال TEXT سوف يصبح صندوق لادخال النص
مثال :
http://up3.m5zn.com/get-8-2014-xr5y0qqxjrj.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT TYPE=TEXT NAME="realname">الاسم<br>
<INPUT TYPE=TEXT NAME="age">العمر<br>
<INPUT TYPE=TEXT NAME="email">البريد الالكتروني<p>
<INPUT TYPE=SUBMIT VALUE="submit">
</FORM>
</code> </code>
CHECKBOX
عند تحديد نوع مربع الادخال CHECKBOX سوف يصبح مربع للاختيار
مثال :
http://up3.m5zn.com/get-8-2014-ms0swe4mwus.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT TYPE=CHECKBOX NAME="maillist">اضافة الى القائمة البريدية!<br>
<INPUT TYPE=CHECKBOX NAME="homepage">اجعل الموقع صفحة البداية!<br>
<INPUT TYPE=CHECKBOX NAME="fav">اضف الموقع للمفضلة!<p>
<INPUT TYPE=SUBMIT VALUE="submit">
</FORM>
</code> </code>
RADIO
عند اختيار نوع مربع الادخال RADIO سوف يصبح مربع للاختيار , لكن ما الفرق بينها وبين CHECKBOX
الخيار RADIO يسمح لك باختيار واحد فقط اما CHECKBOX يسمح لك باختيار اكثر من خيار
مثال :
http://up3.m5zn.com/get-8-2014-dx3f9j27vzx.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
كم طولكـ؟<P>
<INPUT TYPE=RADIO NAME="tall" VALUE="S">قصيـر<BR>
<INPUT TYPE=RADIO NAME="tall" VALUE="M">متوسـط<BR>
<INPUT TYPE=RADIO NAME="tall" VALUE="L">طويـل<P>
<INPUT TYPE=SUBMIT VALUE="submit">
</FORM>
</code> </code>
PASSWORD
عند اختيار الحقل PASSWORD سوف يتم ادراج الاحرف بداخل الحقل على شكل نجوم او نقط مخفيه
مثال :
http://up3.m5zn.com/get-8-2014-1x7qo50gow9.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl" METHOD=POST>
<INPUT TYPE=TEXT NAME="realname">الاسم<BR>
<INPUT TYPE=PASSWORD NAME="mypassword">كلمة المرور<P>
<INPUT TYPE=SUBMIT VALUE="submit">
</FORM>
</code> </code>
HIDDEN
عنـد إختيـار نـوع الحقـل HIDDEN سـوف يتـم ادراج الحقل مخفـي
يتمـ وضعـ فـيه معلومـات لنـ تظهـر بالصفحـة, تستخدم لحفظ معلومات برمجية عند ارسال الفورم لصفحة معينة يتم ارسال قيمتها من الصفحة المرسلة الى الصفحة المرسل اليها
مثال:
مربعـ تسجيل الدخولـ login او نموذج التسجـيل register وصفحهـ اتصلـ بنـا وغيرهـا الكثيـر
http://up3.m5zn.com/get-8-2014-l01g6xpavso.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <H2 align="right">ضع تعلـيق على الموضـوع</H2>
<FORM dir="rtl"METHOD=POST ACTION="../cgi-bin/mycgi.pl">
<INPUT TYPE=HIDDEN NAME="postingID" value="98765">
الاسم:<INPUT NAME="realname" SIZE=30> <BR>
بريدك:<INPUT NAME="email" SIZE=30><BR>
الموضوع:<INPUT NAME="subject" VALUE="رد: مربع الادخال وكل ما يتعلق به" SIZE=30><P>
التعليق:<BR>
<TEXTAREA NAME="comments" COLS=50 ROWS=10 WRAP=VIRTUAL>
</TEXTAREA>
<P><INPUT TYPE=SUBMIT VALUE="أرسـل!">
</FORM>
</code> </code>
لاحـظ اننا وضعنـا حقـل مخفي يحتوي على رقمـ البوستـ
SUBMIT
يستخدم هذا النـوع لعمـل زر يقوم بارسـال الفورمـ
مثـآل :
http://up3.m5zn.com/get-8-2014-xghej54dfv1.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT NAME="realname">: الأسم<BR>
<INPUT NAME="email">: البريـد<P>
<INPUT TYPE=SUBMIT VALUE="ارسال">
</FORM>
</code> </code>
RESET
يستخدم لعمـل زر لاعادة الحقـول الى الوضع الاصلي
مثـال :
http://up3.m5zn.com/get-8-2014-amextuhp84z.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT TYPE=TEXT><p>
<INPUT TYPE=SUBMIT>
<INPUT TYPE=RESET>
</FORM>
</code> </code>
BUTTON
يستخدم لتحديد النوع زر عند الضغط عليه يقوم بتنفيذ امر ما
مثل زر ارفاق ملف في المشاركة وغيرها الكثير
مثـال :
http://up3.m5zn.com/get-8-2014-9j660f234yi.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT NAME="realname" SIZE=30>الاسم :<p>
<INPUT TYPE=BUTTON OnClick="alert(this.form.realname.value);" VALUE="زر يقوم بتنفيذ امر">
</FORM>
</code> </code>
FILE
يستخدمـ لعمـل حقل وزر لاستعراض الملفاتـ من الجهاز
مثل مركز التحميل
مثـال :
http://up3.m5zn.com/get-8-2014-lc3pgg6bhgy.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM METHOD=POST ENCTYPE="multipart/form-data" ACTION="../cgi-bin/mycgi.pl">
<INPUT TYPE=FILE NAME="upfile"><p>
<INPUT TYPE=SUBMIT VALUE="رفـع الملـف">
</FORM>
</code> </code>
IMAGE
يستخدم لوضـع صورهـ بوظيفهـ زر
مثـال :
http://up3.m5zn.com/get-8-2014-0jins5vkt7q.jpg
رمز PHP:
<code style="white-space:nowrap"> <code> <FORM ACTION="../cgi-bin/mycgi.pl">
<INPUT NAME="realname"> : الإسم
<INPUT
TYPE=IMAGE
SRC="http://image.kooora.com/i.aspx?i=competitions%2ffifa.jpg"
HEIGHT=110 WIDTH=160
ALT="صورة بوظيفة زر" ALIGN=ABSMIDDLE
>
</FORM>
</code> </code>
الآن نـاتي لشرح طريقةـ العنـاصر :
TYPE : نـوع الحقـل
TEXT | CHECKBOX | RADIO | PASSWORD | HIDDEN | SUBMIT | RESET | BUTTON | FILE | IMAGE
NAME : إسمـ الحقـل
أي اسم تريـده شرط الا يبتدء برقم او رمـز
VALUE : قيمة الحقـل
SIZE : حجـم الحقـل
MAXLENGTH : اقصى عدد للحروف
فلا يسمحـ بادخال حروف اكثر من العدد المسموح به في الحقـل
CHECKED : جعـل مربـع الاختيار radio او CHECKBOX مفعـل
BORDER : حجم حدود الحقـل او الصورة
SRC : رابط الصورة
ALT : نص يظهر عند وقوف الماوس على الصورهـ
WIDTH : عرض العنصر او الصورة بالبكسل او المئوي
HEIGHT : ارتفاع العنصر او الصورة بالبكسل او المئوي
ALIGN : وضع العنصر او الصورة باتجاه معين يمين او يسار او منتصف
RIGHT | LEFT | CENTER
READONLY : جعل مربع ادخال النص غيـر قابـل للتعديل
DISABLED : جعـل العنصـر غيـر فعـال ولا يمكـن تغيير قيمتهـ
onClick : تنفيذ امر عند الضغط على العنصر
onChange : تنفيذ امر عند تغيير قيمه العنصر
onFocus : تنفيذ امر عندما يصبحـ العنصـر فعـال
onBlur : تنفيذ امـر عندمـا يصبحـ العنصر غير فعـال
onKeyPress : تنفيذ أمـر عند ضغط أحد الازرار على العنصـر
onKeyUp : تنفيذ أمـر عند رفـع اليد عن زر الكيبورد
onKeyDown : تنفيذ امـرر عند ضغط على زر الكيبورد
AUTOCOMPLETE : عنـد الضغط على الحقـل تظهـر الكلمـات التي قمـت بكتابتهـا سابقـا في الحقل
ألعاب الأندرويد مجانا و حصريا (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)©
