HTML میں تعارف Form: ساخت، ان پٹ کی اقسام اور مثالیں۔

ایچ ٹی ایم ایل form ویب ڈویلپمنٹ کا ایک اہم حصہ ہے جو صارفین کو ویب سائٹ کے ساتھ بات چیت کرنے اور سرور پر ڈیٹا جمع کرنے کی اجازت دیتا ہے۔ Form مقاصد کی ایک وسیع رینج کے لیے استعمال کیا جاتا ہے، جیسے کہ صارف کو جمع کرنا form ، صارف کے ان پٹ پر کارروائی کرنا، اور کسی ویب سائٹ پر صارف کے اعمال کو فعال کرنا۔ اس مضمون میں، ہم صفات اور مختلف قسم کے ان پٹ فیلڈز، منتخب عناصر، ٹیکسٹیریاز، اور بٹنوں کو دیکھیں گے جو عام طور پر HTML میں استعمال ہوتے ہیں form ۔

ان پٹ فیلڈز

  • <input type="text">: ایک ٹیکسٹ ان پٹ فیلڈ بناتا ہے جہاں صارف حروف عددی حروف داخل کر سکتے ہیں۔
  • <input type="password">: ایک پاس ورڈ ان پٹ فیلڈ دکھاتا ہے جو درج کردہ حروف کو ماسک کرتا ہے۔
  • <input type="email">: ان پٹ فیلڈز کے لیے ای میل کی توثیق فراہم کرتا ہے جن کے لیے ایک درست ای میل ایڈریس کی ضرورت ہوتی ہے۔
  • <input type="number">: ان پٹ کو صرف عددی اقدار تک محدود کرتا ہے۔
  • <input type="checkbox">: ایک چیک باکس کی نمائندگی کرتا ہے جسے صارف منتخب یا غیر منتخب کر سکتے ہیں۔
  • <input type="radio">: ایک ریڈیو بٹن کی نمائندگی کرتا ہے جو صارفین کو اختیارات کے گروپ میں سے ایک اختیار منتخب کرنے کی اجازت دیتا ہے۔
  • <input type="file">: صارفین کو فائلوں کو منتخب کرنے اور اپ لوڈ کرنے کے قابل بناتا ہے۔
  • <input type="submit">: ایک بٹن دکھاتا ہے جو form کلک کرنے پر جمع کر دیتا ہے۔
  • <input type="reset">: ایک بٹن دکھاتا ہے جو form اس کی ابتدائی حالت پر دوبارہ سیٹ کرتا ہے۔
  • <input type="date">: تاریخوں کے انتخاب کے لیے تاریخ چننے والا فراہم کرتا ہے۔
  • <input type="time">: صارفین کو وقت کی قدریں داخل کرنے کی اجازت دیتا ہے۔

عناصر کو منتخب کریں۔

  • <select>: منتخب اختیارات کے ساتھ ڈراپ ڈاؤن مینو بناتا ہے۔
  • <option>: ڈراپ ڈاؤن مینو کے اندر ایک آپشن کی وضاحت کرتا ہے، جو <select> ٹیگ کے اندر رکھا گیا ہے۔
  • <optgroup>: ڈراپ ڈاؤن مینو میں ایک ساتھ گروپس سے متعلق اختیارات۔
  • <select multiple>: صارفین کو کلک کرنے کے دوران Ctrl کلید(یا میک پر کمانڈ کی) کو دبا کر ایک ساتھ متعدد اختیارات منتخب کرنے کی اجازت دیتا ہے۔

ٹیکسٹیریز

<textarea>: ایک ملٹی لائن ٹیکسٹ ان پٹ فیلڈ بناتا ہے جہاں صارف متن کے لمبے بلاکس کو داخل اور ایڈٹ کر سکتے ہیں۔ rows اس کا سائز تبدیل کیا جا سکتا ہے اور cols اس کے طول و عرض کی وضاحت کرنے جیسی صفات کے ساتھ ترتیب دیا جا سکتا ہے ۔

بٹن

<button>: ایک بٹن کی نمائندگی کرتا ہے جو ایک کے اندر مختلف کارروائیوں کو متحرک کرسکتا ہے form ۔ اسے جمع کرنے کے لیے استعمال کیا جا سکتا ہے form ، فی form جاوا اسکرپٹ فنکشن، یا کسی دوسرے صفحہ پر نیویگیٹ کرنے کے لیے۔

استعمال کی مثال:

<form action="/submit-form" method="post">  
  <label for="name">Name:</label>  
  <input type="text" id="name" name="name" required>  
    
  <label for="email">Email:</label>  
  <input type="email" id="email" name="email" required>  
    
  <label for="message">Message:</label>  
  <textarea id="message" name="message" rows="4" cols="50"></textarea>  
    
  <label for="newsletter">Subscribe to Newsletter:</label>  
  <input type="checkbox" id="newsletter" name="newsletter">  
    
  <label for="color">Favorite Color:</label>  
  <select id="color" name="color">  
    <option value="red">Red</option>  
    <option value="blue">Blue</option>  
    <option value="green">Green</option>  
  </select>  
    
  <button type="submit">Submit</button>  
</form>

یہ مثال مختلف عناصر کے استعمال کو ظاہر کرتی ہے form ، بشمول input فیلڈز textarea ، checkbox, select dropdown اور submit بٹن۔ form اپنی مخصوص ضروریات کی بنیاد پر عناصر اور صفات کو اپنی مرضی کے مطابق کرنے کے لیے آزاد محسوس کریں ۔