العنصر الذي يسمح لك بإرسال النموذج. النماذج في HTML. مجموعة من عناصر القائمة

💖 هل يعجبك؟شارك الرابط مع أصدقائك

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

لذلك، قام المستخدم بتنزيل صفحة ويب توجد عليها عناصر التحكم لإدخال المعلومات. يتم دمج كل منهم في مجموع مشترك يسمى استمارة.يحتوي كل نموذج على زر، عند الضغط عليه يتم نقل البيانات التي أدخلها المستخدم إلى برنامج المعالجة. تتم استضافة هذا البرنامج على خادم الويب الذي يخدم هذه الصفحة. يمكن إنشاء مثل هذه البرامج باستخدام مجموعة متنوعة من تقنيات البرمجة. يتم توحيدهم فقط من خلال إجراء واحد لتلقي البيانات من صفحة ويب. يتم إرسال البيانات باستخدام واجهة بوابة CGI (واجهة البوابة العامة). لذلك، غالبًا ما تسمى برامج المعالجة بتطبيقات CGI أو نصوص CGI.

لذلك، يتلقى التطبيق البيانات ويعالجها. بعد ذلك يمكنه إما إرسال بعض رسائل البريد الإلكتروني، أو إجراء بعض العمليات في قاعدة البيانات، أو إرسال صفحة ويب جديدة للمستخدم، وتقتصر الإجراءات الممكنة فقط على خصائص التكنولوجيا وخيال المبرمج. بمساعدة مثل هذه البرامج، تعمل جميع أنواع أنظمة التسجيل وأنظمة التعليقات وكتب الضيوف والمنتديات والمحادثات. وبمساعدتهم، يتم إنشاء أنظمة أكثر شمولاً وتعقيدًا، على سبيل المثال، المتاجر عبر الإنترنت.

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

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

تحتوي العلامة، بطبيعة الحال، على عدد من المعلمات التي تحدد خصائص النموذج الذي تم إنشاؤه. دعونا ننظر في هذه المعلمات.

  • معامل فعلإلزامي. قيمته هي عنوان URL يشير إلى موقع تطبيق CGI الذي سيقوم بمعالجة البيانات التي أدخلها المستخدم باستخدام عنصر التحكم في هذا النموذج.
  • معامل طريقةيهدف إلى تحديد الطريقة التي سيتم بها نقل البيانات إلى تطبيق المعالجة. يتم استخدام إحدى الكلمتين الأساسيتين المحددتين مسبقًا كقيمة المعلمة: يحصلأو بريد. الآن لا نحتاج إلى معرفة الآليات التي يتم تنفيذها باستخدام هذه الطريقة أو تلك. بطريقة أو بأخرى، تشير الوثائق المصاحبة لتطبيق CGI إلى طريقة نقل البيانات التي يجب استخدامها. الرمز الافتراضي هو يحصل.
  • معامل com.enctypeيستخدم للإشارة إلى نوع البيانات المطلوب تقديمها من النموذج. ليست هناك حاجة عادةً لاستخدامه، نظرًا لأن قيمته application/x-www-form-urlencoded، الافتراضي، مثالي للغالبية العظمى من تطبيقات CGI.
  • معامل قبول مجموعة الأحرفيتم استخدامه في الحالات التي لا ينقل فيها المستخدم المعلومات فحسب، بل ينقل أيضًا الملفات من النموذج إلى التطبيق. في هذه الحالة، يمكننا تحديد ترميزات الملفات المنقولة بشكل واضح. قيمة هذه المعلمة عبارة عن سلسلة نصية يتم فيها كتابة اسم ترميز واحد أو أكثر. إذا تم استخدام عدة ترميزات، يتم فصل أسمائها بمسافات أو فواصل. القيمة الافتراضية هي مجهولوالذي يخبر الخادم أنه يجب عليه معرفة الترميزات المستخدمة
  • معامل يقبليحدد أنواع الملفات التي سيتم نقلها. لا يتم استخدامه عادةً، نظرًا لأن الخادم قادر تمامًا على التعرف بشكل مناسب على نوع الملف الذي يتم استلامه.
  • معامل اسميسمح لك بتحديد اسم فريد للنموذج. وبطبيعة الحال، يمكن أن يكون هناك عدة نماذج على صفحة ويب واحدة. في هذه الحالة، يجب ألا تتطابق قيم معلمات الاسم.

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

القائمة 1.33





حقل لإدخال سطر من النص< input type="text">




أرز. 1.32. نافذة المتصفح تظهر نتيجة الملف الموضح في القائمة 1.33

لذلك، في الرسم التوضيحي يمكنك أن ترى أننا تمكنا من إنشاء حقل إدخال نص وزر، عند النقر عليه، سيتم إرسال المعلومات التي أدخلها المستخدم إلى تطبيق CGI للمعالجة. وإذا نظرنا إلى رمز القائمة، فسنرى أنه تم إنشاء كل من الزر وحقل الإدخال باستخدام نفس العلامة . يتم ضبط خصائص هذه العلامة باستخدام معلماتها المتعددة، والتي سننظر فيها الآن.

  • معامل يكتبربما تكون المعلمة الرئيسية. باستخدام قيمته، يمكننا تعيين نوع عنصر التحكم الذي سيتم إنشاؤه. القيمة هي إحدى الكلمات الأساسية التالية: نص، كلمة مرور، مربع اختيار، راديو، إرسال، إعادة تعيين، ملف، مخفي، صورة، زر.القيمة الافتراضية هي نص.سننظر في هذه الأنواع بمزيد من التفصيل بعد قليل.
  • معامل اسممصممة لتعيين أسماء فريدة لكل عنصر تحكم. على الرغم من أن هذه المعلمة اختيارية، إلا أنها يوصى بها بشدة. يجب أن تشير الوثائق المصاحبة لتطبيقات CGI إلى كيفية تسمية سلطات إدخال المعلومات المقابلة.
  • معامل قيمةيُستخدم لتحديد قيمة العرض الافتراضية للأزرار وحقول إدخال النص. إذا استخدمنا أزرار الاختيار، ثم قيمة المعلمة قيمةلن تكون مرئية للمستخدم، ولكن هذه هي القيمة التي سيحصل عليها تطبيق معالجة CGI إذا قام المستخدم بتحديد زر الاختيار المناسب.
  • معامل التحققيستخدم فقط للمفاتيح المستقلة وأزرار الاختيار. ويحدد حالتهم الأولية. إذا تم إدخال هذه المعلمة في العلامة، سيتم تحويل المفتاح إلى حالة التشغيل. يتم استخدام المعلمة بدون قيم.
  • معامل عاجزيجعل عنصر التحكم غير متوفر للاستخدام من قبل المستخدم. يتم استخدام المعلمة بدون قيم.
  • معامل يقرأ فقطينطبق فقط على نصوص الإدخال لأنواع كلمات المرور النصية. ويعني استخدام هذا الخيار أنه لا يمكن تغيير البيانات المعروضة في هذه الحقول.
  • معامل مقاسيحدد عادةً أبعاد جهاز إدخال البيانات. ولكن لكل نوع على حدة من أعضاء الإدخال، فإن عملها محدد.
  • معامل com.maxengthيسمح لك بتعيين الحد الأقصى لعدد الأحرف الممكنة التي يمكن للمستخدم إدخالها في حقول إدخال النص. قيمة المعلمة هي عدد صحيح موجب.
  • معامل srcيُستخدم في الحالات التي نقوم فيها بإنشاء عناصر تحكم في الإدخال تتعلق بالرسومات. قيمة هذه المعلمة هي عنوان URL لملف الرسم الذي يحتوي على الصورة المعروضة.
  • معامل بديليسمح لك بإنشاء أوصاف مختصرة لسلطة إدخال البيانات التي يتم إنشاؤها. يمكن عرض هذا الوصف كتلميح صغير عندما يقوم المستخدم بتمرير مؤشر الماوس فوق عنصر الإدخال هذا.
  • معامل tabindexيحدد رقم عنصر التحكم في تسلسل جميع الكائنات، ويتم نقل تركيز الإدخال بينها عن طريق الضغط المتتالي على مفتاح tab.
  • معامل مفتاح الوصوليسمح لك بتعيين "مفتاح التشغيل السريع"، عند الضغط عليه من قبل المستخدم، سينتقل تركيز الإدخال إلى عنصر التحكم هذا.

لذلك، نظرنا إلى المعلمات المستخدمة في العلامة. لكننا نعلم بالفعل أنه باستخدام هذه العلامة يمكننا إنشاء مجموعة واسعة من كائنات النماذج. حان الوقت للنظر إليهم بالتفصيل.

تنقسم الكائنات المضمنة في النموذج إلى نوعين - أجسام إدخال البيانات والأزرار التي تبدأ إجراءات مختلفة. أولا دعونا نرى كيف يمكننا إنشاء أجهزة الإدخال.

أحد كائنات النماذج الأكثر شيوعًا هو حقل الإدخال ذو السطر الواحد. في القائمة 1.33 رأينا أنه تم إنشاؤه باستخدام معلمة النوع مع نص القيمة. في الوقت نفسه، نحتاج في كثير من الأحيان إلى وضع قيود على الحد الأقصى لعدد الأحرف الممكنة التي يمكن للمستخدم إدخالها في هذا الحقل. يتم تنفيذ هذا القيد باستخدام المعلمة maxlength.

هناك تعديل لحقل إدخال النص المكون من سطر واحد، وهو مخصص خصيصًا لإدخال المعلومات الحساسة، على سبيل المثال، كلمات المرور. يعرضون النص الذي تم إدخاله ويستبدلونه بالعلامات النجمية. يتم إنشاء حقول الإدخال هذه باستخدام البناء التالي:

باستخدام النوع خانة الاختياريسمح لك بإنشاء مفاتيح مستقلة. إنها مربعات مألوفة يمكننا من خلالها، بنقرة ماوس، تحديد وإزالة مربعات الاختيار في شكل علامات اختيار. في هذه الحالة، يتم استخدام معلمة القيمة. سيتم تمرير قيمة هذه المعلمة إلى تطبيق CGI إذا قام المستخدم بتحديد خانة الاختيار هذه.

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

دعونا نلقي نظرة على مثال قواعد إنشاء وعرض أجهزة إدخال المعلومات المدروسة.

القائمة 1.34

:! DOCTYPE HTML عام "-//W3C//DTD HTML 4.01//EN"
http://www.w3.Qrg/TR/html4/strict.dtd">
,

حقل لإدخال سطر من النص


حقل كلمة المرور


التبديل المستقل


تبديل المجموعة
البديل 1


البديل 2
أخبر الأصدقاء