صناديق الاختيار (Checkboxes)

في HTML، تُستخدم صناديق الاختيار (checkboxes) لإنشاء مجموعة من الخيارات حيث يمكن للمستخدم تحديد خيارات متعددة من المجموعة. يتم إنشاء صناديق الاختيار باستخدام وسم <input> مع ضبط خاصية type على "checkbox".

إليك الصيغة الأساسية لإنشاء مربع اختيار (checkbox) في HTML:

<input type="checkbox" id="option1" name="checkboxgroup" value="option1">
<label for="option1">Option 1</label>

• <input>: الوسم الذي يحدد حقل الإدخال.
• type="checkbox": سمة تحدد نوع الإدخال كخانة اختيار.
• id: سمة تعطي خانة الاختيار معرفاً فريداً.

• name: سمة تقوم بتجميع مربعات الاختيار (checkboxes) معاً. على عكس أزرار الاختيار (radio buttons)، يمكن تحديد عدة مربعات اختيار تحمل نفس الاسم في نفس الوقت.
• value: سمة تحدد القيمة المرتبطة بمربع الاختيار. يتم إرسال هذه القيمة إلى الخادم عند إرسال النموذج.

• <label>: وسم يوفر تسمية توضيحية قابلة للنقر لصندوق الاختيار (checkbox). يجب أن تتطابق سمة for الخاصة بالتسمية مع سمة id الخاصة بصندوق الاختيار.

إليك مثال على كيفية إنشاء مجموعة من مربعات الاختيار:

<form>
	<input type="checkbox" id="option1" name="mygroup" value="option1">
	<label for="option1">Option 1</label><br>
	
	<input type="checkbox" id="option2" name="mygroup" value="option2">
	<label for="option2">Option 2</label><br>
	
	<input type="checkbox" id="option3" name="mygroup" value="option3">
	<label for="option3">Option 3</label><br>
</form>

في هذا المثال، لدينا نموذج يحتوي على ثلاث خانات اختيار، تنتمي جميعها إلى نفس المجموعة لأنها تشترك في نفس سمة name ("mygroup"). لكل خانة اختيار id و value فريدان، وتسمية مقابلة. عندما يختار المستخدم خياراً واحداً أو أكثر من هذه الخيارات ويرسل النموذج، سيتم إرسال قيم خانات الاختيار المحددة إلى الخادم.