---
title: "Sócmhainní Foirm (an aicme ``Meáin ``)"
version: 5.2
locale: ga
source: https://docs.djangoproject.com/ga/5.2/topics/forms/media/
canonical: https://djangodocs.dev/ga/5.2/topics/forms/media/
---
# Sócmhainní Foirm (an aicme Meáin )

Teastaíonn níos mó ná HTML amháin ar fhoirm gréasáin tarraingteach agus éasca le húsáid a rindreáil - teastaíonn bileoga stíl CSS uaidh freisin, agus más mian leat giuirléidí mhaisiúla a úsáid, b'fhéidir go mbeidh ort roinnt JavaScript a áireamh ar gach leathanach freisin. Braithfidh an teaglaim cruinn de CSS agus JavaScript atá ag teastáil d'aon leathanach ar leathanach ar leith ar na giuirléidí atá in úsáid ar an leathanach sin.

Seo a dtagann sainmhínithe sócmhainní isteach. Ligeann Django duit comhaid éagsúla - cosúil le bileoga stíle agus scripteanna - a cheangal leis na foirmeacha agus na giuirléidí a dteastaíonn na sócmhainní sin uathu. Mar shampla, más mian leat féilire a úsáid chun DateFields a léiriú, is féidir leat giuirléid Féilire saincheaptha a shainiú. Is féidir an giuirléid seo a bheith bainteach ansin leis an CSS agus JavaScript atá riachtanach chun an féilire a rinneadh. Nuair a úsáidtear an giuirléid Féilire ar fhoirm, tá Django in ann na comhaid CSS agus JavaScript atá ag teastáil a aithint, agus liosta na n-ainmneacha comhaid a sholáthar i bhfoirm atá oiriúnach le cuimsiú ar do leathanach gréasáin.

> **Sócmhainní agus Riarachán Django**
>
> Sainmhíníonn feidhmchlár Riarachán Django roinnt giuirléidí saincheaptha le haghaidh féilirí, roghanna scagtha, agus mar sin de. Sainmhíníonn na giuirléidí seo riachtanais sócmhainní, agus úsáideann Riarachán Django na giuirléidí saincheaptha in ionad na réamhshocruithe Django Ní chuimsíonn na teimpléid Riaracháin ach na comhaid sin a theastaíonn chun na giuirléidí a léiriú ar aon leathanach ar leathanach ar leith
>
> Más maith leat na giuirléidí a úsáideann feidhmchlár Riaracháin Django, bíodh leisce ort iad a úsáid i d'fheidhmchlár féin! Tá siad go léir stóráilte i `django.contrib.admin.widgets`.

> **Cén foireann uirlisí JavaScript?**
>
> Tá go leor trealamh uirlisí JavaScript ann, agus tá giuirléidí (mar shampla giuirléidí féilire) ar féidir a úsáid chun d'fheidhmchlár a fheabhsú. Sheachain Django d'aon fhoireann uirlisí JavaScript amháin beannú d'aon ghnó. Tá a láidreachtaí agus laigí coibhneasta féin ag gach foireann uirlisí - bain úsáid as cibé foireann uirlisí a oireann do do riach Tá Django in ann comhtháthú le haon fhoireann uirlisí JavaScript.

## Sócmhainní mar shainiú statach

Is é an bealach is éasca le sócmhainní a shainiú mar shainiú statach. Ag baint úsáide as an modh seo, is aicme Meáin istigh é an dearbhú. Sainmhíníonn airíonna an aicme istigh na riachtanais.

Seo sampla:

```
from django import forms

class CalendarWidget(forms.TextInput):
    class Media:
        css = {
            "all": ["pretty.css"],
        }
        js = ["animations.js", "actions.js"]
```

Sainmhíníonn an cód seo `CalendarWidget`, a bheidh bunaithe ar `TextInput`. Gach uair a úsáidtear an CalendarWidget ar fhoirm, treorófar an fhoirm sin chun an comhad CSS ```pretty.css`, agus na comhaid JavaScript ``animations.js ``agus `actions.js``` a áireamh.

Déantar an sainmhíniú statach seo a thiontú ag am rith ina mhaoin giuirléid darb ainm ```meáin ``. Is féidir liosta na sócmhainní do shampla ``CalendarWidget``` a aisghabháil tríd an maoin seo:

```pycon
>>> w = CalendarWidget()
>>> print(w.media)
<link href="https://static.example.com/pretty.css" media="all" rel="stylesheet">
<script src="https://static.example.com/animations.js"></script>
<script src="https://static.example.com/actions.js"></script>
```

Seo liosta de na roghanna Meáin féideartha go léir. Níl aon roghanna riachtanacha ann.

### `css`

Foclóir ag cur síos ar na comhaid CSS a theastaíonn le haghaidh cineálacha éagsúla meán aschuir.

Ba chóir go mbeadh na luachanna sa fhoclóir ina feadán/liosta d'ainmneacha comhaid. Féach: tagairt: an chuid ar chosáin \<form-asset-paths\>\`le haghaidh sonraí maidir le conas cosáin chuig na comhaid seo a shonrú.

Is iad na heochracha sa fhoclóir na cineálacha meán aschuir. Is iad seo na cineálacha céanna a nglacann comhaid CSS leo i ndearbhú meán: 'gach', 'aural', 'braille', 'cabhraithe', 'láimhe', 'priontáil', 'teilgean', 'scáileán', 'tty' agus 'tv'. Más gá duit bileoga stíl éagsúla a bheith agat do chineálacha éagsúla meán, tabhair liosta de chomhaid CSS do gach meán aschuir. Chuirfeadh an sampla seo a leanas dhá rogha CSS ar fáil - ceann don scáileán, agus ceann le haghaidh priontála:

```
class Media:
    css = {
        "screen": ["pretty.css"],
        "print": ["newspaper.css"],
    }
```

Má tá grúpa comhaid CSS oiriúnach do chineálacha meán aschuir iolracha, is féidir leis an eochair foclóra a bheith ina liosta scartha camóg de chineálacha meán aschuir. Sa sampla seo a leanas, beidh na riachtanais mheán céanna ag teilifíse agus teilgeoirí:

```
class Media:
    css = {
        "screen": ["pretty.css"],
        "tv,projector": ["lo_res.css"],
        "print": ["newspaper.css"],
    }
```

Dá ndéanfaí an sainmhíniú CSS deireanach seo a léiriú, bheadh sé ina HTML seo a leanas:

```html+django
<link href="https://static.example.com/pretty.css" media="screen" rel="stylesheet">
<link href="https://static.example.com/lo_res.css" media="tv,projector" rel="stylesheet">
<link href="https://static.example.com/newspaper.css" media="print" rel="stylesheet">
```

### `JS`

Tuple ag cur síos ar na comhaid JavaScript riachtanacha. Féach: tagairt: an chuid ar chosáin \<form-asset-paths\>\`le haghaidh sonraí maidir le conas cosáin chuig na comhaid seo a shonrú.

#### `Script` objects

> **New in Django 5.2**

#### `class Script(src, **attributes)`

Represents a script file.

The first parameter, `src`, is the string path to the script file. See
[the section on paths](#form-asset-paths) for details on how to
specify paths to these files.

The optional keyword arguments, `**attributes`, are HTML attributes that
are set on the rendered `<script>` tag.

See [Cosáin mar rudaí](#form-media-asset-objects) for usage examples.

### leathnú \`\`

Iompar oidhreachta a shainmhíníonn boolean le haghaidh dearbhuithe Meáin .

De réir réamhshocraithe, beidh aon rud a úsáideann sainmhíniú statach Meáin oidhreacht na sócmhainní go léir a bhaineann leis an tuismitheoir giuirléid Tarlaíonn sé seo beag beann ar an gcaoi a shainmhíníonn an tuismitheoir Mar shampla, dá ndéanfaimis ár ngiuirléid Féilire bunúsach a leathnú ón sampla thuas:

```pycon
>>> class FancyCalendarWidget(CalendarWidget):
...     class Media:
...         css = {
...             "all": ["fancy.css"],
...         }
...         js = ["whizbang.js"]
...

>>> w = FancyCalendarWidget()
>>> print(w.media)
<link href="https://static.example.com/pretty.css" media="all" rel="stylesheet">
<link href="https://static.example.com/fancy.css" media="all" rel="stylesheet">
<script src="https://static.example.com/animations.js"></script>
<script src="https://static.example.com/actions.js"></script>
<script src="https://static.example.com/whizbang.js"></script>
```

Oidhreann an giuirléid FancyCalendar na sócmhainní go léir óna ghuirléid tuismitheora Mura dteastaíonn uait go mbeadh ```Meáin ``oidhreachta ar an mbealach seo, cuir dearbhú ``Extend=False``` leis an dearbhú `Meáin`:

```pycon
>>> class FancyCalendarWidget(CalendarWidget):
...     class Media:
...         extend = False
...         css = {
...             "all": ["fancy.css"],
...         }
...         js = ["whizbang.js"]
...

>>> w = FancyCalendarWidget()
>>> print(w.media)
<link href="https://static.example.com/fancy.css" media="all" rel="stylesheet">
<script src="https://static.example.com/whizbang.js"></script>
```

\<dynamic-property\>Má theastaíonn níos mó smachta uait ar oidhreacht, sainmhínigh do shócmhainní ag baint úsáide as a:ref: maoin dinimiciúil . Tugann airíonna dinimiciúla smacht iomlán duit ar na comhaid atá oidhreachta, agus cé nach bhfuil.

## Meáin mar mhaoin dinimiciúil

Más gá duit ionramháil níos sofaisticiúla a dhéanamh ar riachtanais sócmhainní, is féidir leat an maoin ```meáin ``a shainiú go díreach. Déantar é seo trí mhaoin giuirléid a shainiú a thugann sampla de `Forms.Media``` ar ais. Glacann an tógálaí le haghaidh Forms.Media\` argóintí eochairfhocal `css` agus js\` sa fhormáid chéanna leis an bhformáid a úsáidtear i sainmhíniú meán statach.

Mar shampla, d'fhéadfaí an sainmhíniú statach dár nGiuirléid Féilire a shainiú ar bhealach dinimiciúil freisin:

```
class CalendarWidget(forms.TextInput):
    @property
    def media(self):
        return forms.Media(
            css={"all": ["pretty.css"]}, js=["animations.js", "actions.js"]
        )
```

Féach an chuid ar Réadaí Meáin \`\_ le haghaidh tuilleadh sonraí maidir le conas luachanna tuairisceáin a thógáil d'airíonna dinimiciúla \`\`meáin \`.

## Cosáin i sainmhínithe sócmh

### Cosáin mar teaghráin

Is féidir cosáin teaghrán a úsáidtear chun sócmhainní a shonrú a bheith coibhneasta Má thosaíonn cosán le /\`, http: //\` nó `https: //`, léirmhínítear é mar chonair iomlán, agus fágfar é mar atá. Déanfar gach cosán eile a réamhshocrú le luach an réimír chuí. Má tá an aip: mod: django.contrib.staticfiles suiteáilte, úsáidfear é chun sócmhainní a sheirbheáil.

Cibé an úsáideann tú: mod: django.contrib.staticfiles nó nach bhfuil, teastaíonn socruithe an:setting: STATIC\_URL agus:setting: STATIC\_ROOT chun leathanach gréasáin iomlán a rinneadh.

Chun an réimír iomchuí le húsáid a fháil, seiceálfaidh Django an bhfuil an socrú: socrú: STATIC\_URL ```` `None ``agus tiocfaidh sé ar ais go huathoibríoch ag baint úsáid:setting: `MEDIA_URL`. Mar shampla, más é an: socrú: `MEDIA_URL` do do shuíomh ```https://uploads.example.com/ '``agus:setting: `STATIC_URL` ``None ````:

```pycon
>>> from django import forms
>>> class CalendarWidget(forms.TextInput):
...     class Media:
...         css = {
...             "all": ["/css/pretty.css"],
...         }
...         js = ["animations.js", "https://othersite.com/actions.js"]
...

>>> w = CalendarWidget()
>>> print(w.media)
<link href="/css/pretty.css" media="all" rel="stylesheet">
<script src="https://uploads.example.com/animations.js"></script>
<script src="https://othersite.com/actions.js"></script>
```

Ach más:setting: STATIC\_URL is `` `https://static.example.com/ ' ``:

```pycon
>>> w = CalendarWidget()
>>> print(w.media)
<link href="/css/pretty.css" media="all" rel="stylesheet">
<script src="https://static.example.com/animations.js"></script>
<script src="https://othersite.com/actions.js"></script>
```

Nó má tá: mod: ~django.contrib.staticfiles cumraithe ag baint úsáide as an: class: ~django.contrib.staticFiles.Storage.ManifestStaticFilesStorage:

```pycon
>>> w = CalendarWidget()
>>> print(w.media)
<link href="/css/pretty.css" media="all" rel="stylesheet">
<script src="https://static.example.com/animations.27e20196a850.js"></script>
<script src="https://othersite.com/actions.js"></script>
```

### Cosáin mar rudaí

Assets may also be object-based, using [`Script`](#django.forms.Script).
Furthermore, these allow you to pass custom HTML attributes:

```
class Media:
    js = [
        Script(
            "https://cdn.example.com/something.min.js",
            **{
                "crossorigin": "anonymous",
                "async": True,
            },
        ),
    ]
```

If this Media definition were to be rendered, it would become the following
HTML:

```html+django
<script src="https://cdn.example.com/something.min.js"
        crossorigin="anonymous"
        async>
</script>
```

> **Changed in Django 5.2**
>
> The object class `Script` was added.

## Rudaí Meáin \`\`

Nuair a fhiosraíonn tú tréith ```media ``de ghuirléid nó foirm, is é an luach a chuirtear ar ais ná réad ``Forms.Media```. Mar a chonaic muid cheana féin, is é léiriú teaghrán réad ``` `Meáin ``an HTML a theastaíonn chun na comhaid ábhartha a áireamh sa bhloc<head> ``` de do leathanach HTML.

Mar sin féin, tá roinnt airíonna suimiúla eile ag rudaí Meáin .

### Fo-thacair sócmhainní

Mura dteastaíonn uait ach comhaid de chineál áirithe, is féidir leat an t-oibreoir suibscríbe a úsáid chun meán spéise a scagadh amach. Mar shampla:

```pycon
>>> w = CalendarWidget()
>>> print(w.media)
<link href="https://static.example.com/pretty.css" media="all" rel="stylesheet">
<script src="https://static.example.com/animations.js"></script>
<script src="https://static.example.com/actions.js"></script>

>>> print(w.media["css"])
<link href="https://static.example.com/pretty.css" media="all" rel="stylesheet">
```

Nuair a úsáideann tú an t-oibreoir suibscríbe, is é an luach a chuirtear ar ais ná réad nua Meáin -- ach ceann nach bhfuil ach na meáin spéise ann.

### Rud Meáin a chomhcheangal

Is féidir rudaí ```Meáin ``a chur le chéile freisin. Nuair a chuirtear dhá réad ``Meáin ``leis, tá aontas na sócmhainní a shonraíonn an dá rud sa réad ``Meáin``` mar thoradh air sin:

```pycon
>>> from django import forms
>>> class CalendarWidget(forms.TextInput):
...     class Media:
...         css = {
...             "all": ["pretty.css"],
...         }
...         js = ["animations.js", "actions.js"]
...

>>> class OtherWidget(forms.TextInput):
...     class Media:
...         js = ["whizbang.js"]
...

>>> w1 = CalendarWidget()
>>> w2 = OtherWidget()
>>> print(w1.media + w2.media)
<link href="https://static.example.com/pretty.css" media="all" rel="stylesheet">
<script src="https://static.example.com/animations.js"></script>
<script src="https://static.example.com/actions.js"></script>
<script src="https://static.example.com/whizbang.js"></script>
```

### Ordú sócmhainní

Is minic a bhíonn an t-ord ina gcuirtear sócmhainní isteach sa DOM tábhachtach. Mar shampla, d'fhéadfadh go mbeadh script agat a bhraitheann ar jQuery. Dá bhrí sin, déanann rudaí ```Meáin ``a chomhcheangal iarracht an t-ord coibhneasta ina sainmhínítear sócmhainní i ngach rang ``Meáin``` a chaomhnú.

Mar shampla:

```pycon
>>> from django import forms
>>> class CalendarWidget(forms.TextInput):
...     class Media:
...         js = ["jQuery.js", "calendar.js", "noConflict.js"]
...
>>> class TimeWidget(forms.TextInput):
...     class Media:
...         js = ["jQuery.js", "time.js", "noConflict.js"]
...
>>> w1 = CalendarWidget()
>>> w2 = TimeWidget()
>>> print(w1.media + w2.media)
<script src="https://static.example.com/jQuery.js"></script>
<script src="https://static.example.com/calendar.js"></script>
<script src="https://static.example.com/time.js"></script>
<script src="https://static.example.com/noConflict.js"></script>
```

Mar thoradh ar réadanna ```Meáin ``a chomhcheangal le sócmhainní in ord contrártha bíonn ``MediaOrderConflictwarning``` mar thoradh ar `MediaOrderConflictwarning`.

## Meáin ar Fhoirmeacha

Ní hiad giuirléidí na rudaí amháin a bhféadann sainmhínithe ```meáin ``a bheith acu - is féidir le foirmeacha ``meáin``` a shainiú freisin. Tá na rialacha maidir le sainmhínithe meáin ar fhoirmeacha mar an gcéanna leis na rialacha maidir le giuirléidí: is féidir le dearbhuithe a bheith statach nó dinimiciúil; tá rialacha cosán agus oidhreachta do na dearbhuithe sin díreach mar an gcéanna.

Beag beann an sainmhíníonn tú dearbhú ```meáin ``, *gach réad Foirme* tá maoin ``meáin``` ag rudaí foirme uach\*. Is é an luach réamhshocraithe don mhaoin seo mar thoradh ar na sainmhínithe meáin a chur leis do gach giuirléid atá mar chuid den fhoirm:

```pycon
>>> from django import forms
>>> class ContactForm(forms.Form):
...     date = DateField(widget=CalendarWidget)
...     name = CharField(max_length=40, widget=OtherWidget)
...

>>> f = ContactForm()
>>> f.media
<link href="https://static.example.com/pretty.css" media="all" rel="stylesheet">
<script src="https://static.example.com/animations.js"></script>
<script src="https://static.example.com/actions.js"></script>
<script src="https://static.example.com/whizbang.js"></script>
```

Más mian leat sócmhainní breise a cheangal le foirm - mar shampla, CSS le haghaidh leagan amach foirme - cuir dearbhú Meáin leis an bhfoirm:

```pycon
>>> class ContactForm(forms.Form):
...     date = DateField(widget=CalendarWidget)
...     name = CharField(max_length=40, widget=OtherWidget)
...     class Media:
...         css = {
...             "all": ["layout.css"],
...         }
...

>>> f = ContactForm()
>>> f.media
<link href="https://static.example.com/pretty.css" media="all" rel="stylesheet">
<link href="https://static.example.com/layout.css" media="all" rel="stylesheet">
<script src="https://static.example.com/animations.js"></script>
<script src="https://static.example.com/actions.js"></script>
<script src="https://static.example.com/whizbang.js"></script>
```