Django Academy · Oppitunti

Widgetit, otsikot ja ohjeteksti

Määritä, miten kukin kenttä esitetään

Oppitunti 4/413 vaihetta

Widgetit, otsikot ja ohjeteksti on ilmainen Django Academy-oppitunti CoddyKitissä. Tämä on oppitunti 4/4. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu Django Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Django Academy-kurssilla on yhteensä 4 oppituntia.

Lomakkeen viimeistely

Toimiva ModelForm on hyvä alku, mutta automaattisesti luodut syöttökentät tuntuvat pelkistetyiltä. Voit hienosäätää kunkin kentän ulkoasua ja esitystapaa widgetien, otsikoiden ja ohjetekstin avulla. 🎨

Mikä widget on

Widget on kentälle muodostettava HTML-ohjain, kuten tekstikenttä, tekstialue tai päivämääränvalitsin. Vaihda widgetiä, jos haluat muuttaa näytettävää syöttökenttää.

Widgetien ohittaminen Metassa

Määritä Metassa widgets-sanakirja, joka yhdistää kentän nimen toiseen ohjaimeen. Tässä body-kentästä tulee tilava tekstialue.

class Meta:
    model = Post
    fields = ["body"]
    widgets = {"body": forms.Textarea}

Widget-attribuuttien välittäminen

Luo widget-instanssi välittääksesi sille HTML-attrs-attribuutteja, kuten rivimäärän tai CSS-luokan. Näin yhdistät lomakkeet tyylittelyysi.

widgets = {
    "body": forms.Textarea(attrs={"rows": 4})
}

CSS-luokan lisääminen

Sama attrs-sanakirja lisää luokan, jonka avulla tyylitiedostosi voi kohdistaa tyylin syöttökenttään. Tämä sopii hyvin Bootstrapille tai omille utility-luokillesi.

forms.TextInput(attrs={"class": "form-control"})

Paikkamerkin asettaminen

Paikkamerkki vihjaa, mitä kenttään kirjoitetaan, ennen kuin käyttäjä napsauttaa sitä. Lisää se attrs-attribuutin kautta ohjataksesi käyttäjää hienovaraisesti.

forms.TextInput(attrs={"placeholder": "Enter a title"})

Mukautetut otsikot

Django muodostaa kenttien otsikot niiden nimistä, mutta voit ohittaa ne. Metan labels-sanakirja antaa mille tahansa kentälle selkeämmän otsikon.

labels = {"body": "Post content"}

Miksi otsikoilla on merkitystä

Selkeät kenttänimet tekevät lomakkeesta helppolukuisen ja saavutettavan. pub_date-niminen kenttä on käyttäjille paljon selkeämpi, kun se näytetään muodossa "Julkaisupäivä".

Ohjetekstin lisääminen

help_texts-sanakirja näyttää kentän alla pienen vihjeen. Käyttäkää sitä rajojen tai muotoilun selittämiseen ilman, että kenttänimestä tulee sekava.

help_texts = {"title": "Keep it under 60 characters."}

Mukautetut virheilmoitukset

Voitte muotoilla validointivirheet uudelleen myös error_messages-sanakirjan avulla, jolloin tekstit vastaavat sovelluksen tyyliä.

error_messages = {
    "title": {"required": "Please add a title."}
}

Kootaan kaikki yhteen

Kaikki nämä määritetään rinnakkain Meta-luokassa. Widgettien, kenttänimien ja help_texts-arvojen yhdistelmällä saatte siistin ja sovelluksen brändiin sopivan lomakkeen lähes ilman lisäkoodia.

class Meta:
    model = Post
    fields = ["title", "body"]
    labels = {"body": "Content"}

Pikatarkistus

Mikä Meta-sanakirja muuttaa kentästä muodostettavan HTML-ohjausobjektin?

Vastaa interaktiivisessa oppitunnissa

Kertaus: kenttien mukauttaminen

Hienoa! Metassa voitte määrittää widgets-, kenttänimi-, help_texts- ja error_messages-asetukset, jotta mikä tahansa ModelForm näyttää ja toimii juuri haluamallanne tavalla. 🌟

Aloita maksutta

Opi Python tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit: 30
Oppitunnit: 120

Aloita opiskelu maksutta Näytä koko kurssi

Usein kysytyt kysymykset

Onko oppitunti ”Widgetit, otsikot ja ohjeteksti” ilmainen?

Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa Django Academy-oppimispolun 3 oppituntia, myös oppitunnin “Widgetit, otsikot ja ohjeteksti”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Django Academy-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Widgetit, otsikot ja ohjeteksti”?

Määritä, miten kukin kenttä esitetään Harjoittelet Django Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Django Academy-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Django Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 4/4.

Kuinka kauan ”Widgetit, otsikot ja ohjeteksti”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Django Academy-oppitunnilla?

Kyllä. Jokainen Django Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

← Takaisin: Django Academy