فاصلة
  • HTML
  • ?
    : ترتيب الدرس
  • 17
    عدد الدروس
  • ?
    أخر تحديث

النماذج في لغة HTML

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

في HTML ، يتم تعريف النموذج باستخدام علامات . يتم تعريف عناصر النموذج الفعلية بين هاتين العلامتين.

<form>
هنا عناصر النموذج
</form>

العنصر input

هذا هو العنصر الأكثر استخدامًا في نماذج HTML. لأنة يتيح لك تحديد أنواع مختلفة من حقول إدخال المستخدم مثل النص وأزرار الاختيار وخانات الاختيار وما إلى ذلك.

 النصوص text

تُستخدم حقول النص عندما تريد أن يكتب المستخدم كميات قصيرة من النص في النموذج. وهذا عن طريق تحديد نوع البيانات التي يم أدخالها في العنصر input عن طريق الخاصيةType

<form>
<input type="text">
</form>

العنصر Radio Buttons

هي عبارة عن أختيارات يتم أختيار واحد منها عندما تريد من المستخدم تحديد خيار واحد فقط من مجموعة من الخيارات المحددة مسبقًا. مثلاً يمكنك استخدامها لمعرفة نوع المستخدم عن طريق تحديد خيارين (ذكر أو أنثي) .

لاحظ أنه يمكن للمستخدم تحديد خيار واحد فقط. إذا نقروا فوق خيار آخر ، فسيتم تحديد الخيار الجديد وسيتم إلغاء تحديد الخيار الأول. ولكن في حالة أنك تريد من المستخدم أكثر من أختيار واحد يمكنك استخدام العنصر CheckBOX  التالي .

<form>
<
input type="radio">
<
input type="radio">
<
/form>

العنصر checkbox

تشبه مربعات الاختيار أزرار الاختيار ، لكنها تمكن المستخدم من تحديد اختيارات متعددة.يجب استخدام مربعات الاختيار عندما تريد السماح للمستخدمين بإجراء أكثر من اختيار.

<form>
<
input type="checkbox">
<
input type="checkbox">
<
/form>

العنصر submit

العنصر submit هو عبارة عن زرار يقوم بأجراء مهمة محدده عند الضغط علية, ويمكننا برمجتة بحيث عند الضغط علية يقوم بأرسال بيانات النموذج إلي قاعدة البيانات, ومهام أخري كثيرة يمكن أنشائها عن طريق submit

<form>
<
input type="submit">
<
/form>

العنصر select 

هي قائمة منسدلة مع خيارات محددة. يسمح للمستخدم بتحديد خيار واحد من قائمة الخيارات المحددة مسبقًا. ويتم أضافة أختيارات مختلفة للعنصر عن طريق عنصر أخر وهو <option>

<form>
<
select>
<
option>الأختيار الأول<option>
<
option>الأختيار الثاني<option>
<
/select>
<
/form>

عنصر textarea

 لتمكين المستخدمين من إدخال كتله نصية كبيرة .من المستحسن استخدام سمة maxlength لتقييد إدخال المستخدم على عدد معين من الأحرف.

<form>
<
textarea>

<
/
textarea>
<
/
form>
الأدوات أساسيات العناصر خصائص العناوين الفقرات الأنماط التنسيق التعليقات الألوان الروابط الصور الجداول القوائم الترتيب النماذج الميتا تاج