streamalism.org

1. Pregled

Thymeleaf je vrlo popularan predložak koji se isporučuje zajedno s Spring Boot-om. O tome smo već objavili niz članaka i toplo preporučujemo da pređete na Baeldungovu seriju dušica dušica.

U ovom uputstvu ćemo pogledati kako raditi Odaberi i opcija oznake u majčinoj dušici.

2. Osnove HTML-a

U HTML-u možemo napraviti padajući popis s više vrijednosti:

 Jabučna banana Narančasta kruška 

Svaki se popis sastoji od Odaberi i ugniježđena opcija oznake. Prema zadanim postavkama, web preglednik će prikazati popis s prvom odabranom opcijom.

Pomoću možemo kontrolirati koja je vrijednost odabrana odabran atribut:

naranča

Štoviše, možemo odrediti da se opcija ne može odabrati pomoću onemogućeno atribut:

Molimo izaberite...

3. Majčina dušica

U Thymleafu možemo koristiti th: polje atribut za povezivanje pogleda s modelom:

Iako gornji primjer zapravo ne zahtijeva upotrebu mehanizma predložaka, u naprednijim primjerima koje ćemo slijediti vidjet ćemo snagu Thymeleaf-a.

3.1. Opcija Bez odabira

Ako razmišljamo o scenariju u kojem postoji više mogućnosti za odabir, čist i uredan način prikazivanja svih njih je pomoću th: svaki atribut zajedno sa th: vrijednost i th: tekst:

U gornjem primjeru koristimo niz brojeva od 0 do 100. Dodjeljujemo vrijednost svakom broju ja do opcija oznake vrijednost atribut, a koristimo isti broj kao prikazana vrijednost.

Kôd majčine dušice prikazat će se u pregledniku kao:

 0 1 2 ... 100 

Razmislimo o ovom primjeru kao stvoriti, tj. započinjemo s novim oblikom, a postotna vrijednost nije trebala biti unaprijed odabrana.

3.2. Odabran Opcija

Ako sada želimo proširiti svoj obrazac s ažuriranje funkcionalnost, tj. vraćamo se na prethodno stvoreni zapis, a obrazac želimo popuniti postojećim podacima treba odabrati opciju.

To možemo postići dodavanjem th: odabrano atribut uz neki uvjet:

U gornjem primjeru želimo unaprijed odabrati vrijednost 75 provjerom ako ja jednako je 75.

Međutim, ovaj kod neće raditi, a prikazani HTML bit će:

 0 ... 74 75 76 ... 100 

Da bismo to popravili, moramo ga ukloniti th: polje i zamijenite ga s Ime i iskaznica atributi:

Na kraju ćemo dobiti:

 0 ... 74 75 76 ... 100 

4. Zaključak

U ovom kratkom članku provjerili smo kako raditi s biračima padajućeg / popisa u Thymeleaf-u. Postoji jedna uobičajena zamka s unaprijed odabranim vrijednostima, za koju smo pokazali rješenje.

Kao i uvijek, kod korišten tijekom rasprave možete pronaći na GitHubu.