UPORABA PODATKOVNE TABELE V JSF.

Primer vnaprej določene tabele.
V tem laboratoriju bomo videli preprost primer, ki prikazuje, kako uporabljati komponento DataTable, ta element nam omogoča povezavo podatkovne tabele z našo stranjo na naslednji način:

Za ta prvi primer bo samo predhodno naseljena komponenta povezana z našim razredom gradnika, kasneje pa bo prikazano, kako dinamično manipulirati z njenimi informacijami.

Na začetku bomo ustvarili projekt JSF z naslednjo strukturo:

Kot lahko vidimo, sta ustvarjena 2 razreda Java, eden ustreza razredu osebe, ki nam omogoča obdelavo ljudi, ki jih bomo prikazali v naši tabeli, drugi pa gradniku, ki nam bo omogočil upravljanje tabele z ustreznimi stolpce in zapise.
Razred Person.java nam nudi osnovne podatke o osebi, ki jih bomo prikazali v tabeli, tu dodamo ustrezne metode set in get ter konstruktor s parametri za neposredno izpolnjevanje ljudi.

Razred TablaBean.java se nanaša na tabelo in upravljanje ljudi v njej, prikazani zapisi so shranjeni v vrsti osebe ArrayList, ki je za namene tega vodnika izpolnjena v konstruktorju.

V index.xhtml ustvarimo komponento DataTable, ki ji povežemo seznam ljudi neposredno v vrednosti in v ustreznih stolpcih atribute gradnika, na katerega se sklicuje var=”data”, pri čemer je data element, ki predstavlja podatke predmeta Oseba v vsaki vrstici tabele.

Ko ga zaženemo, bomo imeli nekaj takega

Kot lahko vidimo, so informacije predstavljene v načinu tabele, saj še nismo povezali slogov CSS, cenimo samo strukturo v vrsticah in stolpcih brez kakršnega koli oblikovanja, vendar lahko tabeli dodamo lastnost »obrobe« in rob, ki ima nekaj takega:

Končno vemo, da lahko izkoristimo predstaviti informacije na bolj strukturiran način.

Primer upravljanja podatkov v DataTable.
V tem razdelku bomo nadaljevali s prejšnjim primerom, kjer bomo videli, kako manipulirati s podatki tabele za izvajanje običajnih postopkov, kot so registracija, spreminjanje ali brisanje informacij.

Dodajte osebe.
Za registracijo oseb bomo spremenili našo stran index.xhtml, na katero bomo povezali obrazec za registracijo oseb. To storimo tako, da povežemo vhodne in izbirne komponente v mrežni plošči, ki je pravilno povezana s predmetom "myPerson", v katerega se pošiljajo različni podatki. register atributi, nato je povezan gumb, ki kliče metodo "addPerson()", ki bo omogočila nova oseba je registrirana v našem sistemu.

Kot vidimo, so ti novi elementi dodani pred podatkovno tabelo in dobijo rezultat, kot je ta:

Po spremembi indeksa bomo naredili potrebne spremembe v razredu TableBean.java, saj bomo v tem primeru še naprej uporabljali privzeto raven obsega, tako da bomo naredili seznam oseb statičen, tako da ga bo mogoče brez težav manipulirati, poleg tega bomo odpravili polnjenje seznama, saj je ideja, da bi lahko osebe registrirali prek registracijskega obrazca.

Kot lahko vidimo, pri definiranju seznama kot statičnega ustvarimo njegov primerek na ravni razreda, tega ne naredimo v konstruktorju, saj bo to ob različnih priložnostih poklical naš jsf, kar bi povzročilo nov primerek seznama, ki bi povzročijo, da izgubimo informacije, ki jih lahko vsebuje.

Dodatno smo dodali objekt tipa Person, da lahko upravljamo podatke o registraciji in dodali metodo “aggregarPersona()”, ki omogoča dodajanje novega elementa na seznam in jo prikličemo z gumbom jsf, kasneje generiramo nov primerek objekt “minhaPessoa”, ki bo omogočil čiščenje registracijskega obrazca.


Pri zagonu sistema bomo videli naslednje vedenje:

Na začetku je obrazec prazen in prikazana je tudi glava naše tabele, vendar brez kakršne koli vsebine (ne pozabite, da smo odpravili izpolnjevanje seznama), tako da ne prikaže glave, ko še ni registriranih ljudi, zato uporabimo »rendered« lastnost, kjer potrdimo, da je velikost seznama večja od nič, sicer ne bi smel prikazati glav. (Delovanje te lastnosti bo podrobneje obravnavano kasneje)

Ko dodamo osebe, se shranijo na seznam in predstavijo v DataTable

Izbriši osebe.
Ko uspešno registriramo osebe na našem seznamu, jih lahko odstranimo z njega. Za to bomo v našo podatkovno tabelo dodali nov stolpec dejanj, ki bo vseboval povezavo do metode »eliminatePerson()«, ki jo bomo ustvarili v našem gradniku

Da bi to naredili, spremenimo index.xhtml, kjer bomo za stolpcem »Seks« dodali stolpec »Dejanja«.

Kot lahko vidimo, uporabljamo komponento in v akciji pokličemo metodo »eliminarPersona()«, ki ji bomo kot parameter poslali vrednost »data«, pri čemer se spomnimo, da so podatki enakovredni predmetu seznama, ki je prikazan v določeni vrstici.

Kasneje smo v razredu TablaBean.java dodali metodo »eliminarPersona()«, ki kot parameter prejme objekt osebe, ki ga želimo izbrisati, to ustreza »podatkom«, ki jih pošljemo iz jsf, in je enakovredno osebi v vrstico, ki jo želimo izbrisati, da jo nato odstranimo s seznama.

Pri zagonu sistema bomo imeli naslednje:

In vsakič, ko izbrišemo zapis prek ustrezne povezave, se tabela posodobi

Uredi osebe.
Ko smo uspešno registrirali in izbrisali osebe z našega seznama, jih lahko spremenimo, za to bomo spremenili našo tabelo, tako da jo bo mogoče urejati, ko bomo želeli posodobiti nekatere podatke, za to bomo znova uporabili lastnost "rendered", ki bo prikazala ali skrijete možnosti, ki jih je mogoče urejati, odvisno od odločitve uporabnika.

Kot lahko vidimo, je v vsakem od stolpcev dodana komponenta ki bo privzeto skrit zaradi lastnosti »rendered«, ki vam omogoča shranjevanje resničnih ali lažnih podatkov za prikaz ali skrivanje spremne komponente.

V našem primeru »data.edit« izvede klic logične spremenljivke (edit), ki smo jo dodali razredu Person; če je lastnost resnična, bo prikazal da omogoči urejanje, če pa je lastnost true false (ni res), bo prikazal

Enako je treba storiti za stolpce poklic, plača in spol, kjer namesto a slednjemu, a ker v obrazcu uporabljamo izbirno kombinacijo naslednje poti:

Podobno mora upodobljena lastnost prikazati kombinacijo ali oznako, odvisno od primera.

Pozneje je spremenjen stolpec »Dejanja«, kjer smo prej imeli samo povezavo do »Izbriši«, zdaj pa bomo dodali še 2 povezavi, eno za »urejanje« in drugo za »shranjevanje« informacij po urejanju.

Kot lahko vidimo, so zdaj na voljo 3 povezave za metode urejanja, shranjevanja in brisanja, vendar imata ureditev in shranjevanje lastnost upodobljene, zaradi katere sta vidni samo 2 od 3 povezav hkrati (ne pozabite, da upodobljena vsebuje true ali false, odvisno pod pogojem ), tako da bo privzeto povezava za brisanje vedno prikazana, ker nima upodobljene lastnosti, medtem ko urejanje in shranjevanje ne bosta nikoli vidna skupaj. (omogoča dodajanje presledka med povezavami)

Notranje, na grafični ravni, bi dataTable izgledala takole:

Čeprav lahko grafično vidite vse komponente skupaj, je pomembno biti zelo jasen, da bo upodobljena lastnost prikazala komponente samo glede na resnično ali napačno vrednost v danem trenutku.

Po spremembi index.xhtml je zdaj čas, da spremenite razred Person.java, ki mu je dodana lastnost »urejanje«, ki jo uporablja zgoraj omenjeni upodabljalnik.

Kot lahko vidimo, je nov logični atribut povezan z ustreznim nizom in getom. Poleg tega smo za prilagoditev strukture vaje dodali lastnost parametriziranemu konstruktorju, čeprav se na tej točki vaje ne uporablja več.

Na ta način bi vsakič, ko se rendered=”#{data.edit}” izvede v index.xhtml, poklicala to spremenljivko, ki bi omogočila prikazovanje ali skrivanje komponent, odvisno od primera.

Končno in s prejšnjimi spremembami smo začeli spreminjati razred Bean, kjer moramo pri brisanju in shranjevanju dodati ustrezne metode, ki se kličejo iz polja »Dejanja«.

Kot lahko vidimo, metoda editPersona() prejme objekt osebe (iz klica jsf, kot je storjeno v metodi delete) in njena lastnost »urejanje« se spremeni tako, da ji pošlje vrednost true, kar bo omogočilo, da se ta zapis skrije the in pokažite in da izvedete želeno spremembo.

Po drugi strani pa bo metoda savePersona() odgovorna za spreminjanje vsake lastnosti »urejanje« vseh predmetov na seznamu v vrednost false, tako da se dataTable obnovi z vrednostmi ljudi in ne z elementi, ki jih je mogoče urejati.

Pri zagonu sistema bomo imeli naslednje:

In ko pritisnete uredi, se sistem spremeni v:

Kot lahko vidite, ko kliknete povezavo za urejanje, so komponente, ki jih je mogoče urejati, samodejno prikazane, medtem ko so tiste, ki jih ni mogoče urejati, skrite, podobno povezava za urejanje izgine, da naredi prostor za povezavo za shranjevanje, kot je razloženo zgoraj.

In pripravljen!!!

Na svojem blogu in na svojem kanalu delim gradivo o tem odličnem programskem jeziku, lahko najdete veliko člankov in videi iz ničPokažem vam, kako prenesti potrebna orodja za začetek programiranja, vse bolj se poglobimo skozi osnovne koncepte, skozi koncepti objektno usmerjenega programiranjastandardi, temepodatkovne strukture, dostop do baz podatkov med drugim, do konstrukcije aplikacije z uporabniškimi vmesniki.

Prav tako lahko najdete a tečaj iz nič, kjer učim ustvarjati mobilne aplikacije na androidu skozi video zaporedje po korakih, ki se nenehno posodablja.

In zdaj bom tudi začel zaporedje iz nič, kjer bomo vstopili v svet java Enterprise Edition, vam pokazali, kako nastaviti razvojno okolje in kako ustvariti vaše prve spletne aplikacije z Javo.

Zato vas vabim, da obiščete codejavu.blogspot.com, da obiščete moj kanal Cristian Henao in da se zelo zavedajo novih nadaljevanj

Morda vas bo tudi zanimalo.

Ali želite kaj dodati ali komentirati o tem vnosu? lahko storite ....in če vam je bilo všeč, vas vabim, da ga delite Y Naročite se s klikom na gumb »Pridružite se temu spletnemu mestu«, če želite slišati več objav, kot je ta 😉