Foomamka iyo Gelinta Xogta

Casharkaan, waxaan baran doonaa sida loo abuuro foomamka (forms) HTML-ka. Foomamku waxay u ogolaadaan isticmaalayaasha inay soo gudbiyaan xogta — sida magaca, emaylka, ama fariinta.

1. Summada Foomka (Form Tag)

Foomka HTML waxaa lagu dhisaa summada <form>.

<form action="/gudbi" method="POST">
    <!-- Sanduuqyada xogta halkan -->
</form>

• action: Waa waddada ama URL-ka xogta loo dirayo.
• method: Habka gudbinta xogta (GET ama POST).

2. Summada Input iyo Noocyadeeda

Summada <input> waa qalabka ugu muhiimsan ee foomka. Wuxuu yeelan karaa noocyo (types) kala duwan:

<!-- Qoraalka caadiga ah -->
<label for="magac">Magacaaga:</label>
<input type="text" id="magac" name="magac" placeholder="Gali magacaaga">

<!-- Boostada elektarooniga ah -->
<label for="emayl">Emaylka:</label>
<input type="email" id="emayl" name="emayl" placeholder="qof@example.com">

<!-- Lambarka sirta ah (Password) -->
<label for="pass">Password-ka:</label>
<input type="password" id="pass" name="pass">

<!-- Lambarka telefonka -->
<label for="tel">Telefonka:</label>
<input type="tel" id="tel" name="tel">

<!-- Taariikhda  -->
<label for="taariikh">Taariikhda:</label>
<input type="date" id="taariikh" name="taariikh">

<!-- Sanduuqa hubinta (checkbox) -->
<label>
    <input type="checkbox" name="heshiis"> Waan ogolahay shuruudaha
</label>

3. Summada Label

Summada <label> waxay ku xirtaa qoraalka sanduuqa xogta. Tani waxay muhiim u tahay:

• Isticmaalayaasha screen reader-ka (accessibility).
• Marka la riixo qoraalka, sanduuqa xogta ayaa firfircoonaaya (easier to click).

4. Badhanka Gudbinta (Submit Button)

<button type="submit">Soo gudbi</button>
<!-- ama -->
<input type="submit" value="Soo gudbi">

5. Sanduuqa Qoraalka Weyn (Textarea)

Si aad u hesho qoraal dheer (sida fariinta), isticmaal <textarea>:

<label for="fariin">Fariintaada:</label><br>
<textarea id="fariin" name="fariin" rows="5" cols="30"></textarea>

6. Liis Xulasho (Dropdown / Select)

<label for="dal">Dalalka:</label>
<select id="dal" name="dal">
    <option value="so">Soomaaliya</option>
    <option value="ke">Kenya</option>
    <option value="et">Itoobiya</option>
</select>

Layli (Practice)

1. Abuur foom leh: magaca (text), emaylka (email), da’da (number), iyo badhan gudbin (submit).
2. Ku dar label kasta oo sanduuqa xogta ah.
3. Ku dar sanduuq hubinta (checkbox) oo leh “Waan akhriyay shuruudaha”.
4. Ku dar fagaaro (textarea) fariinta ah.

Sii wadashada: Casharka xigta, waxaan baran doonaa curiyayaasha macnaha leh ee HTML5 (semantic HTML)!