0:05
بسم الله الرحمن الرحيم والصلاة والسلام على أشرف المرسلين سيدنا محمد اليوم سنتحدث معا عن أهم عنصرين في الفورم وهما select والtext area طبعا سمعت شخص يقول لي يا عم أنت كل وقت قلنا أهم عناصر وأهم عنصرين أقول لك معلش مش مشكلة أنا بقول لك بس كاش انت تركز معايا لكن هم والله كلهم مهمين يعني أول عنصر معايا هو select
0:27
بيكون فيه بيخليك تختار واحد من أو اتنين أو تلاتة على حسب ما تحب. ايه فائدة خلينا نقول ان انت عمال تسجل وجي عندك كده كتيرة جدا وليكن زي لاحظ معايا نقطة مهمة ان كل حاجة لازم تفهم لازمتها. عشان لو ما فهمتش لازمتها مش هتفهمها بنسبة كبيرة. دلوقتي انا عندي خيار ان انا ادي لك او واحد من تلاتة ان انت تختارهم. اللي هو نظام التشغيل. ويندوز ولينكس وماك.
0:56
فاستخدمت فيهم هنا لو انت عايز واحد من ثلاثة بس فاستخدمت الراديو لو انت عايز واحد ممكن يختار الثلاثة ان انا فعلا شغال على الثلاثة استخدمت الـ Checkbox عظيم لو طلبت منك بقى تختار الـ Country بتاعك وكتبتلك مثلا ربعمئة Country على سبيل المثال او دتلك Options فيها ربعمئة Options هل من المنطقي ان انت تكتب ربعمئة Options في الصفحة الشخصية يفضل ينزل لحد اخر الشارع عشان يختار منهم
1:22
لا، ليس منطقي المنطقي أن يكون لديك select select هي هذه وظيفته دعونا نرى معاً سلكتنا يكون عبارة عن element للname مثل هذه العناصر كلها بالضبط سأسميه مثلاً books هذه الكتب التي سأشتريها أو الكتاب الذي سأشتريه أريد أن أضع ID لكي لا يوجد مشكلة للابل الخاص بي هذه هي label 4 وسأسميه هنا book والـ ID سيكون اسمه book هذا label سأكتب choose book
1:52
عظيم دلوقتي هختار كتاب جوه select تعالوا نتفرج ع select قبل ماعم فيه اي حاجة دي select يا جماعة بتاعتنا فاضية مافيهاش اي options خالص حلو جدا تعالوا بقى نعمل لها options نحط HR كده هنا ونعمل لها options عشان الشخص يختار منها طيب
2:07
نيجي عند select جوا select بتستخدم tag اسمه option ال option ده بيطلب منك value وهنا text طيب ال text هو اسم الكتاب خلينا اقولك انه اسم الكتاب مثلا اللي هو الخيميائي مثلا book 1 هكتب book 1 وعندي book 2 و book 3 ومش مهمة عندي بقى الكصة دي انا اهم حاجة اوري لك الفكرة طب مين الفاليو ده حلو قوي
2:30
فاكرين لما كنا بنكتب اي حاجة في الحقول وندوس سبمت او سيف عشان نبعت البيانات القيمة اللي انت بتكتبها في الحقل بتتبعت صح كده؟ صح الفاليو دي بقى هي اللي بتتبعت لما انت تختار منها يعني ده البوك ون هيبقى الفاليو بتاعته مثلاً 1 2 3 او اي اسم انت عايزه مفيش مشكلة كده لما الشخص يختار حاجة من دوله ويدوس سيف بتجيله الفاليو دي هي اللي بتروح تعالوا نشوف مع بعض اخترت بوك سري وهقوله سيف بصوا بوك بيساوي سري اللي انت اخترته يبقى انا
2:59
بابعت الفاليو الموجودة في الابتعاد دي مش التكست ده لازم تفرق كويس جدا بين الموضوع ده التكست ده تكتب فيه اي حاجة لكن دي الفاليو اللي بتتبعت هي دي اهم حاجة عظيم جدا طيب انا عندي دلوقتي كتب بقى كتير
3:13
عندي كتب كتير بقى جدا ومتقسمة يعني في كتب مثلا خيال علمي في كتب رومانسية في كتب بوليسية في كلام ده كله هل بإمكاننا تقسيم الـ Options اللي جوه السلكت؟ آه بإمكاننا التقسيم بسهولة جدا عن طريقتك اسمه
3:31
من اسمه كنا نسيبه باسمه Option Group تعالوا كده نعمل التك بتاعنا ادي الOpt Group اهو بالشكل ده بتحط جوا مجموعة الOptions بتاعتك اهي بس كده خلص الموضوع
3:45
عندك شوية كتب تاني ادي Option Group وجوا شوية كتب تاني خلص الموضوع ادي Book 4 و ادي Book 5 و ادي Book 6 و نديلهم مثلا Value 4 و Value 5 و Value 6 و صلى الله و بارك و خلص الموضوع عظيم
4:00
طيب عندي سؤال السؤال هو ال Option Group دي هل اقدر اسميها طبعا تقدر تسميها بص كده ال Option Group موجودة ايه بس فاضية شايف انت مش عارف التلاتة دول عبارة عن ايه انا عايزك انت قسمتهم ليه فقولي بقى التلاتة دول ايه تصنفهم الكاتجوري بتاعهم ايه هو هتيجي هنا تكتب Label شكل ده وتكتب جوه Label Romantic مثلا Books وتيجي هنا تكتب Label مثلا
4:36
هي مسمهاش بوليس بس لكن ما علينا هنا زي ما انت شايف رومانتيك بوكس مكتوبة اصلا غلط اكيد في لغة حرف الاس وهنا زي ما انت شايف بوليس بوكس ده اوبشن جروب متقدرش تختاره انت بتختار من دول او دول هنا ده عبارة عن بس تنظيم للبيانات او للأوبشنز اللي جوه السلكت بتاعك طيب عظيم الكلام ده وجميل ومفيش فيه اي مشكلة خالص تعالوا كده نجرب مع بعض كده تجربة تانية
5:04
هل يمكن الشخص اختار اكثر من كتاب؟ نعم ممكن. لو انت سمحت له عن طريق انك تكتب هنا كده ملتبل. ملتبل يعني الشخص سيقدر هنا يختار اكثر من كتاب. شايفين يا شباب؟ ازاي بيختارهم يا ترابوس؟ مفيش. لازم تدوس كده كنترول وتدوس على ده. كده اخترت اتنين ودي دول اتنين. شايفين؟ اتنين واتنين. الملتبل بتسمح لك ان الشخص يختار من الاينبوت اكتر من قيمة. بالشكل اللي انت شفته ده.
5:30
حسناً، جميل جداً وعظيم ومثل الفل هل لدينا شيء يمكن أن يجعل الشخص عند فتح بوكس التحديد يستطيع إختار شيء من هذه الأشياء؟ نعم لدينا شيء يسمى Selected هل ترون ما هو Selected؟ انظروا إلى هذا الشكل معاً Book 4 لماذا أعطني Book 4؟ لأن هذا هو الذي تقوم بإنشاءه
5:50
لماذا نختار هذا الخيار؟ عندما تعمل في مواقع وتجد أنك اخترت هوايتك من وسط 20 هواية طبيعي أنني عندما أدخل عد الهوايات أنه لا يجلبها من الأول سيجلب لي هواية قبل ذلك سليكتد فعشان كده طبيعي أن يكون عندك هذا الأتريبيوت لكي تستطيع عن طريقه أن تجعل الشخص عندما يدخل يجلب له هواية قبل ذلك
6:12
الحمد لله ندخل على المزيد من المواضيع تسمى textarea من اسمها textarea منطقة لكتابة التكست textarea هو العنصر الوحيد المختلف في الانبوت لأنه له
6:27
ترى يا شباب؟ تقسية لقفل هنا. الـ name عادي سنسميه subject أي شيء من الأشياء التي لدينا لا مشكلة. الـ id لأنه إذا كان لديك label قبل أن تستطيع أن تكتبه فيه لا مشكلة. وسأتركه فارغ و سأبدأ أخبرك عن ما يفعله الـ calls و الـ rows. تعالوا معاً لنرى تقسية. هذه هي تقسية.
6:46
مكان كبير كده بتكتب فيه الكلمات وممكن تعمل له بالشكل ده وتعمل فيه اللي انت عايزه براحتك خالص خالص خالص طيب الشكل ده بالحجم ده جي ازاي اول حاجة محتاج اقولك ان انت تقدر تكتب هنا وتستعمل اللي احنا استعملناها والحاجات دي كلها
7:05
يعني ما فيش مشكلة خالص عشان ما تحسش الموضوع غريب اهو تيست تيكست تكتب فيه اللي انت عايزه ما فيش مشكلة خالص طيب لو جينا عند الكولز دي وخليناها عشرة بدل تلاتين ايه اللي حصل بصوا شباب الاعمدة اللي هي بتخليها تتمدد من عيومين قلت لو جيت قلت له اربعين كولز هتلاقي الاعمدة زادت شايفين السفوف هو الحجم انت شايف فوق خمسة
7:26
سفوفة L نصف 20 ستزيد جدا هل هذه الطريقة السليمة لتنسيق الـ text area ؟ لا دعوني أعطيكم نظرة على المستقبل لكي لا تزعل مني في المستقبل إن شاء الله عندما تتعلم CSS ستستطيع أن تقول الـ height الذي تريده بسهولة بهذا الشكل و الـ width الذي تريده بسهولة بهذا الشكل لن تعتمد نهائيا على الـ attributes في HTMLD ستعتمد على CSS لتنسيق الـ
7:55
text area والتنصيق باقي العناصر كمان من غير اي مشكلة خالص يا رب جماعة الدرس يكون بسيط وسهل وعجبكم اشوفكم ان شاء الله في درس جديد والسلام عليكم
