السبت، 1 يوليو 2017

التعامل مع النماذج فى لغة HTML - الجزء الثالث

التعامل مع النماذج فى لغة HTML - الجزء الثالث

* في الدرس السابق تم شرح النماذج فى لغة HTML لمزيد من المعلومات برجاء الاطلاع على الموضوع من الرابط السابق التعامل مع النماذج فى لغة HTML - الجزء الثاني
* سنستكمل فى هذا الدرس لحديث عن النماذج فى لغة HTML

* Radio Button Form

- تستخدم هذه النوعية من النماذج اذا كان على الزائر اختيار خيار واحد من عدة اختيارات.

كود HTML:


<html>

<head>

<title> Radio Button Form Example</title>

</head>
<body>
<form action="http://www.e4ws.com/profile.php">
<p> Please choose your favorite color:
<br />
<input type="radio" name="color" value="Red" checked="checked" />Red
<input type="radio" name="color" value="Blue" />Blue
<input type="radio" name="color" value="Green" />Green
</form>
</body>
</html>

نتيجة الكود: 

* Checkbox Form

- تستخدم هذه النوعية من النماذج اذا كان على الزائر اختيار خيار واحد او عدة خيارات .

كود HTML:


<html>

<head>

<title> Checkbox Form Example</title>
</head>
<body>
<form action="http://www.e4ws.com/profile.php">
<p> Please choose your favorite color:
<br />
<input type="checkbox" name="color" value="Red" checked="checked" />Red
<input type="checkbox" name="color" value="Blue" />Blue
<input type="checkbox" name="color" value="Green" />Green
</form>
</body>
</html>

نتيجة الكود: 

* Drop Down List Box Forms

- تستخدم هذه النوعية من النماذج اذا كان على الزائر اختيار خيار واحد من قائمة منسدلة.

كود HTML:


<html>

<head>
<title>Drop Down List Box Form Example</title>
</head>
<body>
<form action="http://www.e4ws.com/profile.php">
<p> Please choose your favorite color:
<br />
<select name="color">
<option value="Red">Red</option>
<option value="Blue">Blue</option>
<option value="Green">Green</option>
</form>
</body>
</html>

نتيجة الكود: 


- فى بعض الاحيان نحتاج الى السماح للزوار باختيار اكثر من خيار من قائمة منسدلة و فى هذه الحالة نستخدم Size Attribute لتحديد عدد الخيارات التى تظهر للزائر فى صندوق الخيارات كما نستخدم Multiple Attribute لتمكن الزائر من اختيار اكثر من خيار.

كود HTML:

<html>
<head>
<title>Multiple Select Box Form Example</title>
</head>
<body>
<form action="http://www.e4ws.com/profile.php">
<p> Please choose your favorite color:
<br />
<select name="color" size="3" multiple="multiple">
<option value="Red">Red</option>
<option value="Blue">Blue</option>
<option value="Green">Green</option>
<option value="Yellow">Yellow</option>
</form>
</body>
</html>

نتيجة الكود: 

يتبع فى الجزء الرابع من درس التعامل مع النماذج فى لغة HTML ....

0 التعليقات

إرسال تعليق