Tag Input
Tag input component for adding/removing tags.
Preview
Arguments
tag_input(name='labels', label='Labels', event='add_tag', tags=['django', 'rust'])
Usage
views.py
python
from djust import LiveView
from djust.decorators import event_handler
from djust.components import TagInput
class MyView(LiveView):
template_name = "my_template.html"
def mount(self, request, **kwargs):
self.component = TagInput(name='labels', label='Labels', event='add_tag', tags=['django', 'rust'])
@event_handler()
def add_tag(self, **kwargs):
self.component.tags = ... # `add_tag` — see this component's docsmy_template.html
django
{{ component }}Events this component sends to the view: add_tag.
Parameters
| Name | Type | Default | Description |
|---|---|---|---|
| name | str | '' | form field name |
| tags | list | None | None | list of current tag strings |
| event | str — renames the event | '' | dj-click event name |
| placeholder | str | 'Add tag...' | input placeholder |
| label | str | '' | label text |
| custom_class | str | '' | — |
| **kwargs | — passed to `Component.__init__`: `id=` sets `component.id`, and any other keyword is kept as state | — | — |
Source & styles
| File | Path | Notes |
|---|---|---|
| module | djust.components.components.tag_input | Subclass it, or pass custom_class, to change how it renders. |
| css | djust_components/components.css | Defines 6 of this component's classes at line 525, 988, 989, 990, 991, 993. Override those rules, or the custom properties they read, in a stylesheet loaded after it. |
| css | djust_theming/components.css | Defines 1 of this component's classes at line 1453. Override those rules, or the custom properties they read, in a stylesheet loaded after it. |
| css | djust_theming/scaffold.css | Defines 1 of this component's classes at line 445. Override those rules, or the custom properties they read, in a stylesheet loaded after it. |