Learn HTML In Arabic 2021 - #25 - Form Part 2 - Required, Placeholder, Value

بسم الله الرحمن الرحيم والصلاة والسلام على أشرف المرسلين سيدنا محمد سنكمل معاً جميعاً إن شاء الله الفورم وسنأخذ اليوم أهم الأتريبيوت التي ستتعامل معها في عالم الفورم أول شيء لدينا وأهم شيء هو الـ required attribute من الـ required؟ الـ required معناها أن الحقل هذا مطلوب ما يعني مطلوب؟ دعونا نقول لك أنك في هذا الفورم عندما نضغط على submit ما حدث؟ بعت البيانات لكن البيانات فاضية

الحكون بتاعتك فاضية هل ده منطقي؟ لا مش منطقي لو جيت اسجل في موقع هل ينفع اسيب الـ username فاضي والـ password فاضية؟ طب انت بتسجل ازاي؟ لازم حاجة تجبر الشخص انه يكتب بيانات هنا وهنا هنيجي للـ required attribute لو عندك حطل من الحكون محتاج ان هو يكون required يعني مطلوب كتابته بتحط جوه الـ input كده بتاعتك attribute اسمه required بالشكل ده ادي الـ attribute بتاعنا

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

و هجرب اعمل submit بصوا ايه اللي حصل please fill out this field اول حاجة بيمشي يعمل validate يعني بيمشي على الحاجة one by one عشان يشوف ايه المشكلة اول حاجة قالك علي ان انت تكتب في الحقل ده لازم تكتب اسمك فهقوله اسامة و اقوله submit تاني هيعدي السبجيك لانه مش عادي بروحتك عايز تكتبه اكتبه مش عايز خلاص و يجي عند يقولك please fill out this field لازم املأ الحقل ده

فأكتب باسوردي وهو أسامة وينتو سري وقال سبمت كده بعت البيانات طبعاً يا شباب الريكويرد مهم جداً لأن في حقول ما ينفعش الشخص يسيبها فاضية ولازم تكتب له ريكويرد أتريبيوت طيب من ضمن المعلومات الظريفة بس لو لهلك كده من باب العلم بالشيء زمان قبل إصدارات الـ HTML الحديثة كان الريكويرد بتتكتب كده

بقيت مش محتاج تكتب بتساوي بتكتب بس الكلمة وخلاص والبراغزر بيفهمها عشان لو جيت في يوم القادم شفت الشكل الغريب اللي أنا كنت كاتبه ده ما تقولش الله ده أصلا ما تضحك علينا ما قلناش على الحركة دي يعني يلا الله يسامحوا بقى فأنا حبيت بس أقول لك عشان هي جات في السكة طيب ده كلام عظيم وجميل وزي الفل تعالوا مع بعض نشوف اللي بعده اللي هو بالمناسبة من أهم الاتريبيوتات اللي حلوة حلوة الاتريبيوتات دي صح؟

وهو Placeholder. إذا أردت أن أكتب في هذا الـ username معلومة معينة أو يمكن أن لا يكون هذا الـ label موجود في يوم من الأيام. كيف يمكن الشخص أن يعرف أن هذا الـ input field عبارة عن حقل يخص الـ username؟ عن طريق Placeholder. كلمة Placeholder يعني شيء يحجز مكان. Placeholder يمسك هذا المكان.

و اكتب placeholder = و اكتب فيه الكلمة التي تريد ان تقولها للشخص دعونا نقول لك انه لا يوجد label لان الشخص يعرف انه username فتكتبه هنا username انه الحقل ده حقل username فلو label ليس موجود بصوا كلمة username الشخص عارف انه يكتب هنا username

اول ما تكتب كلمة user name تختفي ترجع تاني تفضي الحكل ترجع تاني ال placeholder عشان يعرفك هنا ايه طب هل ال placeholder بيستخدم بس في الحركة دي لا بيستخدم في حاجات كتير جدا خلينا اقولك ان انت لو عندك hint معينة عايز تقول الشخص اكتب password معقدة هتكتب

اكتبها له فين؟ في العادي في ناس كده كتب بتعمل تحت ويكتب فيه الكلام ده ما فيش مشكلة برضو دي طريقة ظريفة وجميلة والناس دي حبايبنا طب انا ممكن اكتبها له هنا في ممكن اقول له وهكتب له هنا او مسلا بلاش بلاش يعني ان كن زق قوي كده

هنا أقول له اكتب باسورد معقدة يعني ما تروح تكتب من 1 ل 6 شايفين write a complex password الشخص لما يجي يكتب password هيفتكر الهنت اللي ورا دي ويبدأ يسعى بالباسورد بدل ما هي 1 2 3 هيخليها 1 2 3 4 شفت الصعوبة عاملة ازاي يعني حبيت بس اقولك وراوش معاك يعني

عظيم بقى عندنا دلوقتي الريكويرد والبليس هولدر عندنا آخر حاجة وهي أهم حاجة في الدنيا لو عندك دلوقتي في موقع مثلا زي الفيسبوك دخلت على الستينج وعلى البروفايل وعايز تعدل بياناتك يا ترى وانت بتعدل بياناتك عايز تغير في الاسم هل الاسم اللي انت بتغير فيه بيكون فاضي يعني اسمك القديم ما بيكونش موجود والحق الفاضي لا الاسم القديم بيكون موجود عايز اغير الايميل بلاش الاسم

هل عندما أغير الإيميل ، فإنه يجعلني أمامي خانة فضية ، أم أنه يجعلني أمامي خانة فيها الإيميل القديم؟ فإنه يجعلك خانة فيها الإيميل القديم ، فأنا ممكن أن أقوم بعمل قيمة ثابتة في حقل أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أجل تحقيق أعلى من أج

سأخذ نسخة منه واسميها email بالشكل ده email بتاعنا يا شباب سأكتب write a valid

ايميل في البلايس هولدر النوع بتاعه هاي هيكون سيبك من مش عايزه النوع هيكون هخليه وهاجي دلوقتي تاني ليك هرجع لك عشان اوريك نوع طيب عظيم ده بقى حقل دلوقتي يا شباب مش مطلوب يعني ممكن اكتب وابعت خلاص مش مطلوب عظيم جدا ده كلام جميل نيجي بقى عندي ونقول له انا عايز تكون

ايميل القديم. وبعد كده هدخل اغيره وبعدين ابعت البيانات الجديدة. حلو. بتكتفي القيمة اللي عايزها تزهر في الحقل. القيمة بتاعتنا ايه? اللي هو الايميل القديم. ده ايميل القديم. لو رحت عملت هتلاقي الميل ده موجود هنا كقيمة. كأنك انت اللي كتبه. فحضرتك بتروح معلم عليه كده وتكتب ايميل.

email-shet.com هنا شباب زي ما انتم شايفين انا مسحت الايميل قديم حطيت الجديد وهقوله submit عشان اسيف او اروح اعمل البيانات بتاعتي طب شايفين زرار submit ده لو رحت عنده قلتله value بتساوي save هيخلي الكلمة بدل ما هي اسمها submit بقى اسمها save فانا اجي هنا احدث الايميل new مثلاً

ويمكنك تضغط على Save فتتجمع البيانات و تذهب إلى مكان ما هذا أكثر من مجاناً لدينا معلومة بسيطة جداً وفيديوهاته تكون قد انتهت دعونا نرى معاً لو قمت بغيار تقديم الإيميل وضعه في مكان يسمى Email هذا يكون نوعاً Email ومع هذا الوضع سأضع لديه Attribute Required

معناها كده ايه يا شباب ان احنا لازم نكتب الاميل تعالوا مع بعض كده نكتب اسامة او نمشي كده خطوة خطوة سيف مش هيرضى لازم الاسم اوكي اسامة السابجكت هل هو مطلوب لا مش مطلوب هيعدي ويروح على الباسورد هكتب الباسورد بتاعتي وادوس

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

هنا نوع الحطل اللي هو ايميل بيعمل فالد على الميل مش اي حاجة تتكتب فيه لو كتبت قسامة بس مش هتعدي لازم قسامة قات ايميل معين كده يعدي بص عملت قات ودوس سيف بص ايه الحصل بيقول لي لازم تكتب البارت

اللي هو مدبوع لبعد الـA لأن أنت كاتب الـA بس لازم أقول له أسامة أسامة مثلا كده وأقول له Save كده يبعت البيانات لكن الأول ما كانش يقدر يبعتها لأنه Email نوع الحقل Email لو غيرت الحقل ده لـ Text هيقبل منك أي كلمة لكن لما حطيت Email في الـType عرفت أن ده Email فلازم يكون ليه Pattern معين يكتبه عشان يعد

كنت حابب بس اوريك انه الـtype بيفرق كل type في input بيفرق انت بتتكلم عن ايه يارب يا جماعة درس يكون بسيط وسهل وعجبكو اشوفكو ان شاء الله في درس جديد والسلام عليكم