الإعلام الآلي — لغة HTML: النماذج في HTML — الثالثة متوسط — المنهاج الجزائري

مقدمة

النماذج (Forms) في HTML تسمح للمستخدم بإدخال البيانات وإرسالها إلى الخادم. تُستخدم في صفحات التسجيل، البحث، تسجيل الدخول، وغيرها.

وسم النموذج <form>

يحتوي النموذج على عدة عناصر:
– action: عنوان الصفحة التي ستستقبل البيانات.
– method: طريقة الإرسال (GET أو POST).

عناصر الإدخال

• <input type=”text”>: حقل نصي.
• <input type=”password”>: حقل كلمة مرور.
• <input type=”email”>: حقل بريد إلكتروني.
• <input type=”number”>: حقل رقمي.
• <input type=”radio”>: زر اختيار (واحد من عدة خيارات).
• <input type=”checkbox”>: مربع اختيار (عدة خيارات).
• <textarea>: منطقة نصية متعددة الأسطر.
• <select>: قائمة منسدلة.
• <input type=”submit”>: زر الإرسال.

مثال بسيط

<form action="تسجيل.php" method="POST">
  <label>الاسم:</label>
  <input type="text" name="name"><br>
  <label>البريد:</label>
  <input type="email" name="email"><br>
  <input type="submit" value="إرسال">
</form>

التحقق من صحة البيانات

يمكن استخدام خاصية required لمنع إرسال حقل فارغ. كما يمكن استخدام pattern للتأكد من تنسيق معين.

تمارين

التمرين 1: أنشئ نموذج تسجيل مستخدم يحتوي على: الاسم، البريد الإلكتروني، كلمة المرور، تأكيد كلمة المرور.

التمرين 2: اشرح الفرق بين GET و POST في إرسال النماذج.

الخلاصة

النماذج تسمح بالتفاعل مع المستخدم في صفحات الويب. للمزيد: النصوص والفقرات والصور و أساسيات CSS.

📍 دروس مشابهة:

• الإعلام الآلي — درس الأمن السيبراني — الثالثة متوسط — المنهاج الجزائري
• الرياضيات — المتتاليات الهندسية — الثانية ثانوي — المنهاج الجزائري
• ملف ضخم لاساتذة الرياضيات